Search code examples
jqueryslidedownslideupscrolltop

slideDown/Up and scrollTop bugging eachother


When you scroll 150px down, a div will appear on the left (slideDown). When you push the up button, the window should scroll up and the div should hide (slideUp). This happens, but the div slides up, then down again and then back up. What's the problem? Here is the code:

function checkSize() {
    if ($(window).width() > 1250) {
            $(window).scroll(function() {
                if ($(document).scrollTop() > 150) {
                    $("nav#menu-float").slideDown("800");
                }
                else {
                    $("nav#menu-float").slideUp("800");
                }
            });
    }
    else {
        $("nav#menu-float").hide();
    }
}

checkSize();
$(window).resize(function() {
    checkSize();
});

//Back to top
$("div#toTop a").click(function(e) {
    $("body,html").animate({
            scrollTop: 0
    }, 800);
    $(this).parents("nav#menu-float").slideUp("800");
    e.preventDefault();
});

EDIT removed link to test case because the link had gone dead.


Solution

  • I think you can remove that

     $(this).parents("nav#menu-float").slideUp("800");
    

    line, from $("div#toTop a").click(function(e)
    The slideup event is called two times : 1.on click event and that click is calling scroll event again 2.That scroll event tries to slide up again while scrolling to top '0'....