滾動失敗

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”，因此默認情況下將其隱藏。