当用户向下滚动一定数量(像素)时执行jquery代码

execute jquery code when user scrolls down a certain amount (pixels)

本文关键字:像素 执行 代码 jquery 用户 滚动      更新时间:2023-09-26

我想在用户滚动到页面上的某个位置时执行下面的代码;例如600px;(从上到下)。所以在PIXELS中检测600px down。

// $(document).ready(function() {
        $(".slidedown").one('load', function () {
            $(this).slideDown(200);
        }).each(function() {
          if(this.complete) $(this).trigger('load');
        });
// });

这行不通:

  $(document).scroll(function(){
      if (document.scrollHeight > 600) {
     $(".slidedown").one('load', function () {
        $(this).slideDown(200);
    }).each(function() {
      if(this.complete) $(this).trigger('load');
    });
   }
});

只需在触发事件之前设置# of pixels的阈值,当用户向上或向下滚动n个像素时,此函数将被触发

https://jsfiddle.net/7daffjh8/7/

var scrollAmount = 0;
var pixelsToNotify = 200;
$(document).scroll(function() {
  var distance = $(window).scrollTop();
    console.log(distance, scrollAmount);
    if(distance - scrollAmount > pixelsToNotify){
        alert('user scrolled down event');
        scrollAmount = distance;
    }
    if(distance < scrollAmount - pixelsToNotify){
        alert('user scrolled up event');
        scrollAmount = distance;
    }
});

我想这样可以。

$(document).scroll(function(){
   if ($(document).scrollTop() > 600) {
     ... execute code
   }
});
https://jsfiddle.net/ga7140L9/1/