Question

我试图通过css中的不透明度隐藏我的导航，然后让导航淡入淡出大约600px的页面。

除了......当我加载页面时，导航栏以完全不透明度（1）开始。

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

如果有人可以帮助我，我会很感激。

这是一个小提琴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>

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

导航不透明度从页面加载时的0开始

1 个答案: