且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

禁用滚动,但保持滚动条CSS

更新时间:2022-10-15 22:37:30

而不是改变 css ,它将删除滚动条,并且如您所说更改页面的布局,请尝试调用 jquery函数

  //调用你的弹出窗口并在该函数内添加
$('body')。on 'scroll scrollwheel touchmove',function(e){
e.preventDefault();
e.stopPropagation();
return false;
});

然后,当您关闭模式时,调用相同的函数,但将替换为关闭


I can't find a solution to this, there was a question over here, but the answers are not very usable (at least for me).

I have a JavaScript modal pop-up that disables everything on the background by placing transparent div over the page. It also disables the scrolling by setting the overflow to hidden, and must do so, because the page is scrollable with the mouse wheel otherwise and distracts the user.

The problem is, when hiding and showing the scrollbar the page resizes and the effect is ugly. Also, my page is designed in such a way that if I stop it from resizing that would be ugly either.

What I want is to disable the scrollbar, but keep it visible (the page content is longer than the screen fits). Is this somehow possible in CSS?

Instead of changing the css, which will remove the scrollbar, and as you said change the layout of the page, try calling a jquery function instead.

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

then when you close the modal, call the same function but replace on with off