java垂直多级导航栏_垂直导航栏必须从顶部移动一点然后保持固定

Jquery

$(function(){ // this is the shorthand for document.ready

$(document).scroll(function(){ // this is the scroll event for the document

scrolltop = $(document).scrollTop(); // by this we get the value of the scrolltop ie how much scroll has been don by user

if(parseInt(scrolltop) >= 80) // check if the scroll value is equal to the top of navigation

{

$("#navbar").css({"position":"fixed","top":"0"}); // is yes then make the position fixed to top 0

}

else

{

$("#navbar").css({"position":"absolute","top":"80px"}); // if no then make the position to absolute and set it to 80

}

})

});

CSS

#navbar{

position: absolute; // Initially set to absolute so it is movable with the page

top: 80px; right: 100px;

/*display: block;*/

padding-right: 7px;

background: #fff;

}