var responsive = false; var topOffset; function navbarAdjust() { responsive = window.innerWidth < 600; topOffset = $("#nav").height(); var navbar = document.getElementById("nav"); var body = document.getElementById("body"); if (responsive) { navbar.className = "responsive"; body.className = "responsive"; } else { navbar.className = ""; body.className = ""; } } function onLinkClick() { window.scrollBy(0, -topOffset); } function onScroll() { var currentPos = $(window).scrollTop() + topOffset + 5; console.log(topOffset); $('nav a').each(function() { var sectionLink = $(this); var section = $(sectionLink.attr('href')); if (section.position().top <= currentPos && section.position().top + section.height() >= currentPos) { sectionLink.addClass('active'); } else { sectionLink.removeClass('active'); } }); } function onLoad() { navbarAdjust(); onScroll(); } $("nav a").click(function () { var speed = 500; var easing = 'swing'; var sectionLink = $(this); var section = $(sectionLink.attr('href')); var target = section.position().top - $('nav').height(); $("html, body").animate({scrollTop: target, speed, easing}); return false; }); $(window).on("scroll", onScroll); onLoad();