jQuery - Hoeveel gescrolld


Met het onderstaande stukje code kun je kijken hoever een bezoeker naar beneden is gescrolld op een pagina. Op basis van een ingesteld aantal pixels kun je dan een bepaalde code uitvoeren, bijvoorbeeld het vastzetten van het hoofdmenu aan de bovenkant van het scherm zodra deze uit beeld raakt. In het onderstaande geval wordt er een classnaam toegevoegd nadat men 100 pixels of meer naar beneden is gescrolld.

$(document).ready(function() {
        $(window).scroll(function(){
                scrollpx = $(window).scrollTop();
                if(scrollpx>=100) {
                        $("#menu").removeClass("not-fixed").addClass("fixed");
                } else {
                        $("#menu").removeClass("fixed").addClass("not-fixed");
                }
        });
});