Question

我有一个脚本可以改变滚动经过某个点时我的菜单看起来的样子，阻止它反复重复我的动画我已经放入$(window).off("scroll");所以它只执行一次。当我再次向后滚动同一点时，我需要再次更改菜单，但是一旦我关闭滚动，有没有办法可以在某个时刻将其重新打开？

这是我到目前为止所做的：

    var Header = $('#header');
    var Navbar = $('.navbar');
    var links = $(".navbar ul.nav > li > a");
    var HeaderH = Header.height();
    var NavbarH = Navbar.height();


$(window).on("scroll", function(){      
    if ($(this).scrollTop() === (HeaderH + 64)) {
        $(window).off("scroll");
        Navbar.addClass('navbar-fixed-top')
        links.css('padding', '10px 20px 10px 20px');
        Header.css('margin-bottom', '64px');
        $('.navbar-fixed-top').css('top', '-64px')
        $('.navbar-fixed-top').animate({'top' : '0'}, 1000);    
    }
});

Answer 1

只需切换自定义类：

var Header = $('#header');
var Navbar = $('.navbar');
var links = $(".navbar ul.nav > li > a");
var HeaderH = Header.height();
var NavbarH = Navbar.height();

$(window).on("scroll", function(){      
    if ($(this).scrollTop() >= (HeaderH + 64)) {
        if (!Navbar.hasClass('myclass')) {
            Navbar.addClass('navbar-fixed-top myclass')
            $('.navbar-fixed-top').stop().animate({'top' : '0'}, 1000);
        }
    } else {
        Navbar.removeClass('navbar-fixed-top myclass');
    }
});

和CSS：

.myclass {
    padding: 10px 20px;
    margin-bottom: 64px;
    top: -64px;
}

jQuery窗口滚动后关闭

1 个答案: