Arda Zaman
Arda Zaman

Reputation: 137

header remains behind on page

I make fixed header on Onepage. But everything on page remains front on nav. I give, display:block,display:absolute or etc but didn't change anything. Thanks for helping :)

Nav CSS:

img#logo {width:auto;height:75px;  position:absolute; margin-left:90px; }
div#nav {width:1930px;height:75px;border:3px solid #333;margin-top:-20px; }
div#nav ul { list-style-type:none; }
div#nav ul li {float:left;}
div#nav ul#menu1 li a {font:20px Arial, Helvetica, sans-serif; padding:160px; ;line-height:75px; color:#e81717;}
div#nav ul#menu2 li a {font:20px Arial, Helvetica, sans-serif;padding:160px;margin-left:160px; line-height:75px; color:#e81717}

Fixed Menu Jquery :

$(window).scroll(function(){
        var sticky = $('div#nav');
        var stickycolor = $('div#nav ul li a');
        scroll = $(window).scrollTop();

        // blog

         if (scroll >= 945 && scroll < 1750)
             { 
                 sticky.addClass('fixed');
                 sticky.addClass('siyah');  
                 sticky.removeClass('beyaz');
             }

            // hakkımda
         else if(scroll >=1750 && scroll < 2650)
         {
              sticky.addClass('fixed'); 
              sticky.removeClass('siyah');
              sticky.addClass('beyaz');
         }
            // portfolyo
         else if(scroll >=2651 && scroll <3550)
         {
              sticky.addClass('fixed'); 
              sticky.removeClass('beyaz');
              sticky.addClass('siyah');
         }

         else if(scroll >=3551 && scroll <4400)
         {
              sticky.addClass('fixed'); 
              sticky.removeClass('siyah');
              sticky.addClass('beyaz');
         }

         else if(scroll <=944)
         {

             sticky.removeClass('fixed');

         }

For example:

enter image description here

enter image description here

Upvotes: 0

Views: 15

Answers (1)

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167192

It is a z-index issue. Use a higher one here:

div#nav {z-index: 99999;}

Upvotes: 1

Related Questions