Question

如何在向下滚动到＆＃34; myTargetElement＆＃34;时才启动此功能。它会在屏幕上显示，而不是在页面加载后立即显示？

<script src="countUp.min.js" type='text/javascript'></script>

<script>
$(document).ready(function() {
    var countOptions = {
        useEasing : true,
        useGrouping : true,
        separator : ',',
        decimal : '.'
    }
    var customerNumber = new countUp("myTargetElement", 0, 1635, 0, 7, countOptions);
    customerNumber.start();

});
</script>

Answer 1

滚动事件检查目标元素偏移顶部和文档滚动顶部是否相同，如果相同则触发函数

$(document).scroll(function(){
    if($('.myTargetElement').offset().top == $(document).scrollTop()){
        //Trigger function
    }
});

Answer 2

以下脚本一看到就会触发它（http://jsfiddle.net/f1xbgy86/1/）：

$(window).scroll(function() {
                 if(isElementVisible($('#yourElementID'))) {
        $(window).off('scroll');
                     //Call From here

}
});


function isElementVisible(elem)
{
    var visibleTop = $(window).scrollTop();
    var visibleBottom = visibleTop + $(window).height();

    return ((elem.offset().top + elem.height()) <= visibleBottom);
}

如何在滚动到某个div元素后触发javascript函数

2 个答案: