Question

您好如何更改此算法以更正jquery或javascript版本？

    $(window).scroll(function () {
    var y = $(window).scrollTop();
    if (y > 50px)        {
        alert("top visible");$('header').addclass('show');
    } else {
        alert("top invisible");$('header').addclass('hide');
    }
});

Answer 1

scrollTop()返回一个整数，表示像素数。

50px不是整数，它会引发错误。

相反，改变：

y > 50px

到此：

y > 50

另请注意，addClass()的资本 C 。

<小时/> 如果您只是显示和隐藏标题，则可以使用show()和hide()。然后，您可以测试可见性，以确定alert是否应该触发：

$(window).scroll(function () {
  var y = $(window).scrollTop();
  if (y > 50 && !$('header').is(':visible')) {
    alert("top visible");
    $('header').show();
  } 
  else if(y <= 50 && $('header').is(':visible')) {
    alert("top invisible");
    $('header').hide();
  }
});

Fiddle

Answer 2

使用console.log而不是警告来查看幕后发生的事情

$(window).scroll(function () {
    var y = $(window).scrollTop();
    if (y > 50)        {
        console.log("show");
        $('header').addClass('show').removeClass("hide");
    } else {
        console.log("hide");
        $('header').addClass('hide').removeClass("show");
    }
});

http://jsbin.com/hobehi/edit?js,console,output

jQuery并实时检测滚动的位置

2 个答案: