3

当我在我的网站上向下滚动时，我试图显示一个小的“返回顶部”div。这是我的 div 的代码（样式在开发中是内联的，直到我稍后将其全部移动到 base.css 文件中）。

    <div id="backToTop" style="position:fixed; right:10px; top: 200px; width: 50px; height:50px; color:#ffffff; background-color:#000000; visibility:hidden"><a href="#top">Back to Top</a></div>

如您所见，相当简单。然后我尝试使用 jQuery 来检测窗口何时略微向下滚动以显示 div：

    $(window).scroll(function(){
       if($document).scrollTop() > 0){
          $('#backToTop').show();
       }else{
          $('#backToTop').hide();
       }
    });

我的问题是脚本似乎没有被触发。当我向下滚动页面时，div 没有出现。

我的页面上有额外的 jQUery 用于表单验证，因此我尝试将其与该函数一起包含在：

    $().ready(function(){ /* Code goes here */ }

我也试过把它包括在这个之外，但我没有快乐。我在页面的其余部分使用 Twitter 引导程序。

如果有人能指出我为什么这个完全有效的代码不起作用，那就太好了。

干杯，

Ĵ

4

1 回答 1

5

您的代码中有错字：

if($document).scrollTop() > 0){

有一个缺失(：

if( $(document).scrollTop() > 0 ) {
     ^

这是一个工作示例：http: //jsfiddle.net/U7scm/

编辑

我还注意到您正在设置visibility: hidden. jQuery.show()和.hide()函数将切换display属性，所以使用display: none而不是visibility: hidden

于 2013-07-24T11:10:57.207 回答