首页 > CSS在微信浏览器里如何禁止滚动条滚动到底部后继续滚动

CSS在微信浏览器里如何禁止滚动条滚动到底部后继续滚动

在做一个手机端的网页,发现当滚动条已经滚动到底部后,继续下拉还能再滚动1/3个body-height左右,底部出现一大块黑屏很烦。看了下有赞商城等几个比较大的H5项目,在微信浏览器也是这个问题,想问下纯css3能否禁止掉这个问题,就是当滚动条已经滚动到body的最底部的时候禁止滚动。


bodymain的高度设成100%然后main{ overflow-y: scroll; }呢?
猜测可以,没有实验过

<body>
    <main></main>
</body>

纯css够呛……可以尝试当混动底部的时候。通过js……让touchmove失效。具体是否可以。还没有实验。


可以用下面的代码禁掉 下面的黑条和上面黑条。

document.getElementsByTagName('body')[0].addEventListener('touchmove', function (e) {
  e.preventDefault();
});

但是,但是。你就不能滚动整个页面了
在我自己场景里面,因为我监听了其他元素的touchmove,用touchmove代替了scroll,所以我是可以禁掉的。
但是如果你的H5依赖于scroll的话,就不能这样干。

【热门文章】
【热门文章】