滚动失败

Question

这里有一个onscroll事件在这里上是行不通的顶部导航和我不知道为什么。

滚动之前，小搜索图标应该是不可见的。

这是一个小提琴的例子 。

这是放在标头末尾的js：

<script type="text/javascript">
$("body").scroll( function() {
    var value = $(this).scrollTop();
    if ( value > 120 )
        $("#topSearchIcon").css("display", "block");
    else
        $("#topSearchIcon").css("display", "none");
});
</script>

以及html的一部分：

<li id="topSearchIcon"><a href="#"><img width=20" height=20" src ="/images/searchicon.png" /></a></li>

任何想法表示赞赏。

Answer 1

您可以改用$(document).scroll ，这应该可以工作。

看看我的小提琴： http : //jsfiddle.net/7sW84/1/

<script type="text/javascript">
    $(document).scroll( function() {
        if ($(this).scrollTop() > 120) {
            $("#topSearchIcon").css("display", "block");
        }
        else {
            $("#topSearchIcon").css("display", "none");
        }
    });
</script>

如果仍然无法使用，请尝试用$(document).ready(function() {};包装它。

并且不要忘记默认情况下隐藏#topSearchIcon 。

Answer 2

您可以尝试使用ready（）包装脚本。

$(document).ready(function(){
  $("body").scroll( function() {
    var value = $(this).scrollTop();
    if ( value > 120 )
        $("#topSearchIcon").css("display", "block");
    else
        $("#topSearchIcon").css("display", "none");
    });

});

Answer 3

$（document）.scroll在您的页面上对我有用，如果您在控制台中输入以下内容并按Enter：

$(document).scroll( function() {
  var value = $(this).scrollTop();
  if ( value > 120 )
    $("#topSearchIcon").css("display", "block");
  else
    $("#topSearchIcon").css("display", "none");
});

您应该进行的另一项更改是将显示设置为：none; 在您的CSS中输入：“＃topSearchIcon”，因此默认情况下将其隐藏。