Reputation: 13

Show Div first in hierarchy

My menu and slider are included to index.php, and menu is 'under' the slider. I want slider to be under menu. how to do it?

img

Upvotes: 0

Answers (2)

Akshay Prabhakar

Reputation: 479

To make this work go to your file : http://psptorchinim.cba.pl/modules/Menu/down.css

Line Number : 17

#down ul li {
    z-index: 9999; // add this to your existing code.
}

I hope it helps...

Upvotes: 1

PSPTorchinim

Reputation: 13

Code showing menu buttons (datas saved in MySQL)

        <?php
                $tb= $mysql_prefix."modules";
                $dir = end(explode('/', dirname(__FILE__)));
                $tb4 = $mysql_prefix."modules_type";
                $sql4 = 'select * from `'.$tb4.'` where name = "'.$dir.'"';
                $result4 = mysql_fetch_assoc(mysql_query($sql4));
                $sql = 'select * from `'.$tb.'` where typ = '.$result4['id'];
                $result = mysql_fetch_assoc(mysql_query($sql));
                $tb2= $mysql_prefix."menus";
                $sql2 = 'select * from `'.$tb2.'` where module = '.$result['id'];
                $result2 = mysql_fetch_assoc(mysql_query($sql2));
                $tb3= $mysql_prefix.$style."_possitions";
                $sql3 = 'select * from `'.$tb3.'` where id = '.$result['possition'];
                $result3 = mysql_fetch_assoc(mysql_query($sql3));
            ?>

            <head>
                <link rel="stylesheet" type = "text/css" href="<?php echo $result['d'].$result3['type'].'.css'; ?>"/>
                <script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
                <script type="text/javascript">
                $(document).ready(function () {
                    $(document).on('click', "#MainMenu", function(){
                        var content = $(this).attr("value");
                        $.ajax({
                            url: "/scripts/show_content.php",
                            type: "POST",
                            data: {
                                "content": content,
                            },
                            success: function(result){
                                $("#center #Content #text").html(result);
                            },
                        });
                    });
                });
                </script>
            </head>
            <body>
                <div id = "Menu">
                <?php
                    $tb5 = $mysql_prefix."modules";
                    $sql5 = "select * from `$tb5` where possition=$pos";
                    $result5 = mysql_fetch_assoc(mysql_query($sql5));
                    $tb6= $mysql_prefix.str_replace(" ","_",$result5['name']);
                    $sql6 = "Select * From `$tb6` where parent = 0 order by parent";
                    $result6 = mysql_query($sql6);
                    if($result6){
                        include('generate.php');
                        echo '<ul>';
                        while($row = mysql_fetch_array($result6)){
                            $id = $row['id'];
                            $count = mysql_num_rows(mysql_query("Select * From `$tb6` where parent = $id"));
                            if($count>0){
                                echo '<li><button id = "MainMenu" value = "'.$row['type'].','.$row['attached'].'">'.$row['name'].'</button>';
                                generatemenu($id, $tb6);
                            }else{
                                echo '<li><button id = "MainMenu" value = "'.$row['type'].','.$row['attached'].'">'.$row['name'].'</button></li>';
                            }
                        }
                        echo '</ul>';
                    }

                ?>
                </div>
            </body>

Code showing slider:

        <head>
        <style>
            @keyframes sliding{

                0%{
                    right: 0%;
                }
                10%{
                    right: 0%;
                }



                90%{
                    right: 400%;
                }
                100%{
                    right: 0%;
                }
            }

            #Slider{
                border-radius: 10px;
                height:389px;
                max-width: auto;
                overflow:hidden;
            }

            #Slider #SliderImages{
                width: 1000%;
                height:389px;
                position: relative;
                -webkit-animation-name: sliding;
                -webkit-animation-duration: 20s;
                -webkit-animation-iteration-count: infinite;
            }

            #Slider #SliderImages #Container{
                height:389px;
                width: 10%;
                float: left;
                position: relative;
            }

            #Slider #SliderImages #Container img{
                height:389px;
                width: 100%;
            }

            #Slider #SliderImages #Container #SliderText{
                opacity: 0.4;
                min-height:100px;
                margin-left:60%;
                margin-right: 10%;
            }

            #Slider #SliderImages #Container #SliderText p{
                opacity:1;
            }

            #Slider #SliderImages #Container #SliderText:Hover{
                opacity:1;
            }
        </style>
    </head>
    <body>
        <div id = "Slider">
            <div id = "SliderImages">
                <div id= "Container">
                    <img src = "modules/Slider/1.png" >
                </div>
                <div id= "Container">
                    <img src = "modules/Slider/2.png" >
                </div>
                <div id= "Container">
                    <img src = "modules/Slider/3.png" >
                </div>
                <div id= "Container">
                    <img src = "modules/Slider/4.png" >
                </div>
                <div id= "Container">
                    <img src = "modules/Slider/5.png" >
                </div>
            </div>
        </div>
    </body>

Everything is included in body.php which sas style:

    body{
        background-color: #06213F;
        margin-left:100px;
        margin-right:100px;
        font-family: Georgia, "Times New Roman", Times, serif;
        color:black;
        display: block;
    }

    #header{
        display:block;
    }

    #header #up{
        float:center;
    }

    #header #headers{
        display: flex;
    }

    #header #headers #h_left{
        flex: 0.2;
    }

    #header #headers #h_center{
        flex: 0.6;
    }

    #header #headers #h_right{
        flex: 0.2;
    }

    #header #down{
        float:center;
        height:auto;
        background-color: #06213F;
    }

    #center{
        display: flex;
        min-height: 300px;
    }

    #center #c_left{
        flex: 0.20;
        background-color: white;
        border: none;
        border-radius: 10px;
        margin-right: 5px;
    }

    #center #content{
        flex: 0.6;
        background-color: white;
        border: none;
        border-radius: 10px;
    }

    #center #content #text h3{
        margin-left: 10px;
        margin-right: 10px;
    }

    #center #content #text p{
        margin-left: 10px;
        margin-right: 10px;
    }

    #center #content #text button{
        margin-left: 10px;
        margin-right: 10px;
    }

    #center #c_right{
        flex: 0.20;
        background-color: white;
        border: none;
        border-radius: 10px;
        margin-left: 5px;
    }

    #footer{
        display: flex;
    }

    #footer #f_left{
        flex: 0.2;
    }

    #footer #f_center{
        flex: 0.6;
    }

    #footer #f_right{
        flex: 0.2;
    }

    enter code here

Upvotes: 0

Show Div first in hierarchy

Answers (2)

Related Questions