完美解决safari、微信浏览器下拉回弹效果，只保留局部回弹效果。
CSS代码
.box{
overflow: auto;
-webkit-overflow-scrolling: touch;
}HTML代码
<body class="box">
<div class="scroll" style="height:1500px">
</div>
</body>JS代码
var overscroll = function(el) {
el.addEventListener(‘touchstart‘, function() {
var top = el.scrollTop
,totalScroll = el.scrollHeight
,currentScroll = top + el.offsetHeight;
if(top === 0) {
el.scrollTop = 1;
}else if(currentScroll === totalScroll) {
el.scrollTop = top - 1;
}
});
el.addEventListener(‘touchmove‘, function(evt) {
if(el.offsetHeight < el.scrollHeight)
evt._isScroller = true;
});
}
overscroll(document.querySelector(‘.scroll‘));
document.body.addEventListener(‘touchmove‘, function(evt) {
if(!evt._isScroller) {
evt.preventDefault();
}
});本文转载于:猿2048https://www.mk2048.com/blog/blog.php?id=hhj1ahcaakj
原文地址：https://www.cnblogs.com/homehtml/p/12591007.html
时间： 2024-10-10 08:19:26