javascript - 导航不透明度在页面加载时从 0 开始

Question

我试图通过 css 中的不透明度隐藏我的导航，然后让导航淡入页面下方约 600 像素。

我一切正常，除了....当我加载页面时，导航栏开始时完全不透明 (1)。

一旦我向下滚动一个像素，它就会正常工作。即导航不透明度返回到 (0) 然后在 600px 导航不透明度返回到 (1)。

如果有人可以帮助我解决这个问题，我将不胜感激。

这是一个 fiddle http://jsfiddle.net/daugaard47/FpPTm/ .

按运行然后向下滚动页面查看效果。

如果您想快速查看，这是我的脚本。

        $(window).bind('scroll', 'load', function(){
        var                 
            navwrap = $('.navwrap'),
            scrollTop = $(document).scrollTop(),
            limit = 635;
       if (scrollTop >= limit) {
           navwrap.addClass('sticky');

       } else if (scrollTop <= limit) {
           navwrap.removeClass('sticky');              
       }
    });

如果有人能帮助我，在此先感谢。

Answer 1

看起来导航已经在页面首次加载时添加了 sticky 类，它已经应用了 opacity:1。然后当向下滚动 1px 时，它会删除它。

已更新 JSFIDDLE加载时没有粘性类

<div class="navwrap">
    <div id="nav">NAVIGATION</div>
</div>

我不确定您是否需要在加载时使用粘性类，但删除它看起来可以完成工作。