滚动到特定的div或id后触发事件
我搜索了很多这些天，但我没有设法解决我的问题。
我在下面的脚本是一个简单的计数器，从0开始统计一些统计数据。它在我的页面加载时开始。 我想在我滚动到特定的div或id时触发此事件，但仅触发一次。 我用.one（）方法等看了很多例子，但我没有找到合适的解决方案。
这是我的脚本。
<script type="text/javascript">
$.fn.jQuerySimpleCounter = function( options ) {
var settings = $.extend({
start: 0,
end: 100,
easing: 'swing',
duration: 500,
complete: ''
}, options );
var thisElement = $(this);
$({count: settings.start}).animate({count: settings.end}, {
duration: settings.duration,
easing: settings.easing,
step: function() {
var mathCount = Math.ceil(this.count);
thisElement.text(mathCount);
},
complete: settings.complete
});
};
$('.number1').jQuerySimpleCounter({end: 14,duration: 2899});
$('.number2').jQuerySimpleCounter({end: 350,duration: 3300});
$('.number3').jQuerySimpleCounter({end: 450,duration: 4000});
$('.number4').jQuerySimpleCounter({end: 7,duration: 2500});
</script>
那么，在达到某个div或id后，我应该添加什么来触发它？
我设法找到了适合我的“好”解决方案。 做下面的“不太好”的事情。 :)谢谢尼古拉斯的帮助。
<script type="text/javascript">
$(window).scroll(function (event) {
var scroll = $(window).scrollTop();
var one = $('.tworow').position().top;
var two = $('.endrow').position().top;
if (scroll > one & scroll < two) {
$.fn.jQuerySimpleCounter = function( options ) {
var settings = $.extend({
start: 0,
end: 100,
easing: 'swing',
duration: 500,
complete: ''
}, options );
var thisElement = $(this);
$({count: settings.start}).animate({count: settings.end}, {
duration: settings.duration,
easing: settings.easing,
step: function() {
var mathCount = Math.ceil(this.count);
thisElement.text(mathCount);
},
complete: settings.complete
});
};
$('.number1').jQuerySimpleCounter({end: 14,duration: 2899});
$('.number2').jQuerySimpleCounter({end: 350,duration: 3300});
$('.number3').jQuerySimpleCounter({end: 450,duration: 4000});
$('.number4').jQuerySimpleCounter({end: 7,duration: 2500});
};
});
当滚动达到某个div时，它开始，然后我把另一个div放到事件应该结束的地方，用if条件控制它。 现在触发事件的页面区域是2个div之间的非常小的“区域”。
这应该会给你你想要的结果：
$(window).scroll(function (event) {
var scroll = $(window).scrollTop();
var one = $('element').position().top;
var count = 0;
if (scroll > one) {
var newCount = count + 1;
if (newCount === 1) {
//do something
};
};
});