JQuery如何设置页面滚动到指定位置播放动画？

Question

很多h5页面都是这样，当滚动到某个位置的时候开始播放动画，然后动画播放完毕后就完了，不会循环播放，请问是怎么实现的呢？能否提供一个小demo参考下？

Answer 1

JQ

监听滚动事件$(window).scroll()，判断滚动的高度scrollTop()，执行函数。

if(scrollTop>xxx){

    执行操作

}else if(){

    执行操作

}else{

    

}

JS

window.onscroll = function() {

    var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;//scrollTop就是触发滚轮事件时滚轮的高度

    if(scrollTop>xx){

        执行操作

    }

}