Question

我正在创建一个网站，我希望标题（在我的代码中名为floatHeader）在开始时不可见，然后在您开始滚动后变为可见。我已尽力使用JQuery，但我不是很有经验，所以任何建议都会非常感激。 Here是我当前的代码。

$(window).scroll(function () {
    if ($(window).scrollTop() > 10) { 
        $('.floatHeader').css("opacity", 1);
    }
    else{
        $('.floatHeader').css("opacity", 0);
    }
});

Answer 1

您的代码运行正常。您只需要在页面中包含jQuery。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

这是 fiddle 。

Answer 2

您错过了load任何版本的jquery

Working Demo

Answer 3

您错过了在小提琴代码中添加jquery。所以在你的代码中添加jquery文件就像这样。

<script src="http://code.jquery.com/jquery-latest.js"></script>

此外，如果您希望标题在开始时不可见，请设置“style：display：none;”在你的标题中。这将在开始时隐藏您的标题。

<div class="header" style="display:none"></div>

以下是更新后的fiddle。

Answer 4

我建议你使用jquery插件。

这是链接：http://stickyjs.com/

用户滚动时更改div的不透明度

4 个答案: