Add nav class on scroll



  • I'm using this piece of JS to add a css class to the main nav after I start to scroll the page.

    $(document).ready(function() {
        var header = $("#header-menu");
      
        $(window).scroll(function() {    
            var scroll = $(window).scrollTop();
            if (scroll >= 50) {
                header.addClass("scrolled");
            } else {
                header.removeClass("scrolled");
            }
        });
      
    });
    

    But it only works after page reload. First time opening a page, it doesn't work. I reload the page it works. Had the same problem trying to add button ripples but forgot about the $(document) and that solved the problem.

    If someone has any clue about this and is kind to give a little help 😕


  • Global Moderator

    Are there any errors in the js console?



  • @PitaJ No error. But after your reply looked again and saw what I guess is the default way of doing this on Nodebb. And with $(window).on('action:ajaxify.end', function( ) it works as it should. Thank you.


 

Suggested Topics

| |