滑动表层div时 禁止底层滑动

软件发布|下载排行|最新软件

当前位置:首页IT学院IT技术

滑动表层div时 禁止底层滑动

Liiu   2020-02-29 我要评论
 1             $(".container").bind("touchstart", function (events) {
 2                 startX = events.originalEvent.changedTouches[0].pageX;
 3                 startY = events.originalEvent.changedTouches[0].pageY;
 4             });
 5             $(".fanslist_box").bind("touchmove", function (e) {
 6             var ulheight = $(this).height();
 7             var scrollTop = $(this).scrollTop();
 8             var scrollheight = $(this)[0].scrollHeight;
 9             if (ulheight + scrollTop + 20 >= scrollheight) { //滚到底部20px左右
10                 $(".fanslist_box").bind("touchmove", function (event) {
11                     moveEndX = event.originalEvent.changedTouches[0].pageX,
12                     moveEndY = event.originalEvent.changedTouches[0].pageY,
13                     theX = moveEndX - startX;
14                     theY = moveEndY - startY;
15                     if (Math.abs(theY) > Math.abs(theX) && theY > 0) { //这里是判断上滑还是下滑!绝对值方式!
16                         $(".fanslist_box").unbind("touchmove");//滑动到底部再往上滑动,解除阻止! 
17                     }
18                     if (Math.abs(theY) > Math.abs(theX) && theY < 0) {
19                         event.preventDefault();//滑动到底部,再往下滑动,阻止滑动! 
20                     } 
21                 })  
22             }
23             })

 

Copyright 2022 版权所有 软件发布 访问手机版

声明:所有软件和文章来自软件开发商或者作者 如有异议 请与本站联系 联系我们