仅当其包含DIV出现在屏幕上时，如何启动此JQuery计数器？

Question

在Wordpress页面上，我有这段代码可以开始递增计数，但是我只希望当用户向下滚动足够远的页面以使其显示在屏幕上时（它位于包含DIV的“三个柜台部分”。

您如何改进此代码以实现这一目标？

$('.counter').each(function() {
var $this = $(this),
countTo = $this.attr('data-count');
$({ countNum: $this.text()}).animate({
countNum: countTo
},

{ duration: 11000,
easing:'easeInOutCubic',
step: function() {
$this.text(Math.floor(this.countNum));
},
complete: function() {
$this.text(this.countNum);
}
});  
});

Answer 1

您可以简单地执行以下操作以在可见任何元素时触发事件。

setInterval(function(){
  if($('.div1').is(':visible')){
    //do something
  }
  else {
    //do nothing..
  }      
}, 100);

**根据需要更改.div1。