关于自己写的弹出蒙版，不想让后面有滚动条且不能滚动

最新推荐文章于 2024-06-25 14:02:33 发布

原创最新推荐文章于 2024-06-25 14:02:33 发布 · 898 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js #css

css基础，js 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一种在移动端和桌面端项目中禁用页面滚动的方法。对于移动端项目，可以通过阻止touchmove事件的默认行为来实现；对于桌面端项目，则可以通过设置根元素的overflow属性为hidden来达到目的。

如果是移动端项目，阻止 touchmove 事件的默认行为可以防止滚动；如果是桌面端项目，
可以让根元素直接 overflow:hidden。

windows：

在蒙层显示的同时执行下面的 JavaScript 代码：
var widthBar = 17, root = document.documentElement;
if (typeof window.innerWidth == 'number') {
widthBar = window.innerWidth - root.clientWidth;
}
root.style.overflow = 'hidden';
root.style.borderRight = widthBar + 'px solid transparent';

隐藏的时候执行下面的 JavaScript 代码：
var root = document.documentElement;
root.style.overflow = '';
root.style.borderRight = '';