One page nav on and off states based on scrollTop

$(window).scroll(function() { scrollTop = $(window).scrollTop(); //This calculation can be done once instead of being recalculated for each section. $(".section").each(function() { elemTop = $(this).offset().top; elemBottom = elemTop + $(this).outerHeight(); //You already calculated elemTop, might as well reuse it here. id = $(this).children().attr("id"); if (scrollTop >= elemTop && scrollTop <= elemBottom) { $("#nav-bar .current").removeClass("current"); //Find all of the elements with the class of current and remove the class current; $("#nav-bar a[href=#" + id + "]").find('span').addClass("current"); } }); });

Be the first to comment

You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.