javascript - Fix navigation position when scrolling -


i want fix position of navigation @ top when navigation position , scroll position equal.

please let me know how can position of navigation , page scroll position? want this: http://new.livestream.com/live-video-tools

i've tried:

$(function() {      // grab initial top offset of navigation      var sticky_navigation_offset_top = $('#main-heading').offset().top;      // our function decides weather navigation bar should have "fixed" cs s position or not.     var sticky_navigation = function(){         var scroll_top = $(window).scrolltop(); // our current vertical position top          // if we've scrolled more navigation, change position fixed stick top,         // otherwise change relative         if(scroll_top > sticky_navigation_offset_top) {              $('#fixed_nav').css({ 'position': 'fixed', 'top':6, 'left':0, 'width':'100%', 'z-index':999, 'height':80,  'background':'#fff' });         } else {             $('#fixed_nav').css({ 'position': '','overflow': 'visible', 'display':'block','height':80});          }               };      // run our function on load     sticky_navigation();      // , run again every time scroll     $(window).scroll(function() {         sticky_navigation();     }); }); 

this old, deserves answer googlers' benefit.

see fiddle here.

$(function () {     var offset = $('#nav').offset().top;     var nav = function () {         var scroll = $(window).scrolltop();         if (scroll < offset) {             $('#nav').css({ 'position': 'relative' });         }         else {             $('#nav').css({ 'position': 'fixed', 'top': 0 });         }     };     nav();     $(window).scroll(function () {         nav();    //this ensures check again every time user scrolls     });  }); 

op - figured out now, i'm not sure why checking offset of #main-heading , setting position of different #fixed-nav, that's you're issue was.


Comments

Popular posts from this blog

c# - DetailsView in ASP.Net - How to add another column on the side/add a control in each row? -

javascript - firefox memory leak -

Trying to import CSV file to a SQL Server database using asp.net and c# - can't find what I'm missing -