向下滚动时出现Nav Div

Question

当用户向下滚动传递一个名为.header1的div类时，我希望div出现在顶部（此div有3个其他div）

我希望导航显示在.fixedDiv中。我找到了答案 here ，但我无法在我的网站上实施。 这是我得到的

<script type="text/javascript">
    var startY = $('.header1').position().top + $('.header1').outerHeight();
    $(window).scroll(function () {
        if( $(this).scrollTop() > startY ){
            $('.fixedDiv').slideDown();
        }else{
            $('.fixedDiv').slideUp();
        }
    });
</script>

我的网站上有一个名为.fixedDiv的div说topnav，我的问题是div总是在那里。向下滚动时不会隐藏或显示。

This是我网站的链接。

对于css，.header1没有任何设置，因为其他div在里面，它们应该是.fixedDiv出现所需的高度。 .fixedDiv有css

.fixedDiv {
    position:fixed;
    top:0px;
    left:0px;
    background:orange;
}

我知道我已接近完成这项工作，但我似乎无法弄清楚我错过了什么。

Answer 1

测试$(".header1").position()会提供TypeError: undefined is not a function。

由于WordPress，您似乎在noConflict mode。

请改为尝试：

jQuery(document).ready(function($) {
    var startY= $('.header1').position().top + $('.header1').outerHeight();
    $(window).scroll(function () {
        if($(this).scrollTop() > startY ){
            $('.fixedDiv').slideDown();
        }else{
            $('.fixedDiv').slideUp();
        }
    });
});

---

修改：您还有一个额外的<script>代码（至少Chrome会看到它）。它似乎在Firefox中运行良好。

Answer 2

为什么不在滚动时使用带有setInterval的fadeIn和fadeOut？有些东西......

.scroll( function()
{
    if($(".fixedDiv").css('display', 'none'))
    {
        $(".fixedDiv").fadeIn("normal", function()
        {
            setInterval( function() { $(".fixedDiv").fadeOut("normal"); }, 1500 );
        });
    }
}

Answer 3

所以终于搞清楚了，我喜欢它，它看起来很棒

jQuery(document).ready(function() {
var startY= jQuery('.header1').position().top + jQuery('.header1').outerHeight();
jQuery('.fixedDiv').html( jQuery('#nav').html());
jQuery(window).scroll(function () {
    if(jQuery(this).scrollTop() > startY ){
        jQuery('.fixedDiv').slideDown();
    }else{
        jQuery('.fixedDiv').slideUp();
    }
});
});

不确定额外的行（第3行）是做什么的，但是缺少了什么...... 谢谢