CODEWITHSUNDEEP
javascriptjqueryscrollmenubar
Neel
Neel

Reputation: 9880

Jquery Scroll() requires 2 Arguments

I am trying to remove a class from a menu bar when the user scrolls down a page. I read the following topic and doc to get an idea on jquery scroll():

1) https://stackoverflow.com/a/16391580/1050957

2) http://api.jquery.com/scroll/

This is my code:

var jquery = jQuery.noConflict();

jquery(document).ready(function(){      
    $(window).scroll(function () {          
        if (document.body.scrollTop > 100) 
                $('#menuBar').removeClass( "nav-menu" );    
        else
                // something something              
    });        
});

The above code is an extract from the SO answer from another topic (link given above). But when I add that code, I am seeing: Not enough arguments to Window.scroll. error for $(window).scroll(function (). I dont know why its expecting 2 arguments since the doc I read on scroll() uses without an argument. Have I done something wrong? Or has something changed with the later version of Jquery?

I am using jquery v1.11.0

Upvotes: 0

Views: 1381

Answers (2)

Genzotto
Genzotto

Reputation: 1974

You can add an empty param if needed to your scroll function:

$(document).ready(function(){      
    $(window).scroll([], function () {          
        ...
    });        
});

Take a look at this:

http://colorlib.com/wp/forums/topic/fix-a-bug-in-latest-version-window-scroll/

Upvotes: 1

kosmos
kosmos

Reputation: 4288

Use a full jquery code. Working example:

#menuBar { background: yellow; width: 50px; height: 800px; }
#menuBar.nav-menu { background: red; }

<div id="menuBar" class="nav-menu"></div>
<div style="margin-bottom: 999em;"></div>

$(document).ready(function(){

    $(window).on('scroll', function () {  
        var $body = $('body');
        var $target = $('#menuBar');
        if ($body.scrollTop() > 100 && $target.hasClass('nav-menu')){
                $target.removeClass("nav-menu");    
        }
        else if( $body.scrollTop() <= 100 && !$target.hasClass('nav-menu') ){ 
            $target.addClass('nav-menu');
        }

    });

});

Make sure to check if the class is already added to prevent innecesary stuff.

Check jsfiddle

Upvotes: 2

Related Questions