Question

我有一个非常简单的导航栏，可以滚动更改。该徽标应该是预先设置的，但每次滚动页面时都会添加另一个徽标。我有一个布尔值来检查是否已添加徽标但仍然运行代码。这是我的代码：

$(window).scroll(function() {
        var scroll = $(window).scrollTop(),
            hidden = true;
        if (scroll >= 470) {
            $('#nav').addClass('static-nav');
            if(hidden) {
                $('#logo').prepend(' <div class="logo-container"> <img src="img/logo3.png" alt="logo"></div>');
                hidden= false;
            }
        }else{
            $('#nav').removeClass('static-nav');
            if(!hidden) {
                $('.logo-container').remove();
                hidden = true;
            }
        }
    });

Answer 1

隐藏的bool应该在滚动事件函数之外，或者每次更改滚动位置时都是如此。

但你应该检查导航是否可见，而不是按像素到顶部。您无法预测用户是否会以这种方式查看菜单。这样的事情应该有效：

How to tell if a DOM element is visible in the current viewport?

尽管布尔值，但每个滚动前面都有jQuery滚动函数

1 个答案: