javascript - 当它从底部显示 100px 时如何在滚动上触发 jquery 函数

Question

我的网站上有“有趣的事实”计数器，还有一个动画计数的 jQuery 函数有趣的事实 div 中的数字。现在它在页面加载时触发。我想在用户向下滚动到它时启动它。例如，当 div 出现在距屏幕底部 100px 处时。

这是我的 jQuery 函数，它在页面加载时开始计数:

(function($) {
    "use strict";
    function count($this){
    var current = parseInt($this.html(), 10);
    current = current + 10; /* Where 50 is increment */ 
    $this.html(++current);
        if(current > $this.data('count')){
            $this.html($this.data('count'));
        } else {    
            setTimeout(function(){count($this)}, 50);
        }
    }           
    $(".stat-count").each(function() {
      $(this).data('count', parseInt($(this).html(), 10));
      $(this).html('0');
      count($(this));
    });
})(jQuery);

这是我尝试在用户向下滚动到它时让它工作:

(function($) {
    "use strict";
    function count($this){
    var current = parseInt($this.html(), 10);
    current = current + 10; /* Where 50 is increment */ 
    $this.html(++current);
        if(current > $this.data('count')){
            $this.html($this.data('count'));
        } else {    
            setTimeout(function(){count($this)}, 50);
        }
    }        




$(window).scroll(function() {
    $(".stat-count").each(function() {


    var imagePos = $(this).offset().top;

    var topOfWindow = $(window).scrollTop();
        if (imagePos < topOfWindow+400) {

          $(this).data('count', parseInt($(this).html(), 10));
          $(this).html('0');
          count($(this));

        }

       }
    }

 })(jQuery);

谢谢! :)

Answer 1

可能是这样的:

$(window).on('scroll', function(event) {
  if(document.body.offsetHeight - event.pageY <= 100 ) {
   //onscoll effect
}

}