禁用滚动但保留滚动条CSS

Question

我无法找到解决方案,这里有一个问题,但答案不是很有用(至少对我来说).

我有一个JavaScript模式弹出窗口,通过在页面上放置透明div来禁用背景上的所有内容.它还通过将溢出设置为隐藏来禁用滚动,并且必须这样做,因为页面可以使用鼠标滚轮滚动,否则会分散用户的注意力.

问题是,当隐藏和显示滚动条时,页面会调整大小并且效果很难看.此外,我的页面设计的方式是,如果我停止调整大小,那也是丑陋的.

我想要的是禁用滚动条,但保持可见(页面内容比屏幕适合的长).这在CSS中是否有可能？

Answer 1

而不是更改css,将删除scrollbar,并如你所说改变页面的布局,尝试调用一个jquery function代替.

// call your pop up and inside that function add below
$('body').on('scroll mousewheel touchmove', function(e) {
      e.preventDefault();
      e.stopPropagation();
      return false;
});

然后当你关闭模态时,调用相同的函数但替换on为off