javascript - Keep navbar at top of page when scrolled to correct position -
so website have header. @ top of header have logo , slogan, , beneath have nav bar. when user scrolls down want top part of header (logo , slogan) disappear whereas nav bar should stay fixed. know need position:fixed;
added how activate when it's in right place. i've worked bit media queries before. there 1 y-scroll?
thanks
you'll need use javascript here in order subscribe window.onscroll
event.
window.onscroll = function(){ if(window.pageyoffset > 100/*px*/) $('.nav').addclass('fixed_bar'); else $('.nav').removeclass('fixed_bar'); }
and css .fixed_bar
this:
.fixed_bar{ position:fixed; top:0; z-index:10000; } .fixed_bar .logo{ display:none; }
also, you'll have account space fixed nav free , add padding
or margin
beneath element;
Comments
Post a Comment