3

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

我希望导航出现在其中.fixedDiv。我在这里找到了答案，但我无法在我的网站上实现它。这是我得到的

<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 总是在那里。向下滚动时它不会隐藏或出现。

这是我网站的链接。

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

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

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

4

3 回答 3

0

测试$(".header1").position()给出TypeError: undefined is not a function.

由于 WordPress ，您似乎处于无冲突模式。

试试这个：

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 中运行良好。

在此处输入图像描述

于 2012-12-27T03:59:47.427 回答
0

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

.scroll( function()
{
    if($(".fixedDiv").css('display', 'none'))
    {
        $(".fixedDiv").fadeIn("normal", function()
        {
            setInterval( function() { $(".fixedDiv").fadeOut("normal"); }, 1500 );
        });
    }
}
于 2012-12-27T04:10:11.390 回答
0

所以终于弄明白了，我喜欢它，它看起来很棒

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 行）是做什么的，但缺少的是什么......谢谢

于 2012-12-28T04:28:56.530 回答