JS判断手机端页面滚动停止

8次阅读

共计 723 个字符,预计需要花费 2 分钟才能阅读完成。

var topValue = 0,// 上次滚动条到顶部的距离
interval = null;// 定时器
contactsList = document.getElementById(“contactsList”);
contactsList.onscroll = function() { // 我项目中的 contactsList 滚动

if(interval == null) {// 未发起时,启动定时器,1 秒 1 执行
interval = setInterval(function () {
test();
}, 1000);
}
topValue = contactsList.scrollTop;

}

function test() {
// 当滚动停止时,两个计算的距离会相同,此时再执行相关操作
console.log(contactsList.scrollTop,topValue);
if(contactsList.scrollTop == topValue) {
console.log(“ok”);
clearInterval(interval);
interval = null;
}
}
使用手机端滚动后,执行相关事件;onscroll 是在元素滚动轴滚动时触发的。jq mobile 的方法,可看下 http://www.runoob.com/jquerym…。网址上有非常详细的使用方法。scrollstart 事件是在用户开始滚动页面时触发:
$(document).on(“scrollstart”,function(){
alert(“ 开始滚动!”);
});
scrollstop 事件是在用户停止滚动页面时触发:
$(document).on(“scrollstop”,function(){
alert(“ 停止滚动!”);
});

正文完
 0