移动端模态框滚动条问题

问题是这样的,我的移动端页面有滚动条,像这样:

clipboard.png

然后,我在这个页面打开模态框,这个模态框里面也有滚动条,像这样:

clipboard.png

但是,当我移动这个模态框里面的滚动条的时候,外面的滚动条也跟着滚动,这个问题怎么解决啊

clipboard.png

阅读 5.2k
4 个回答

可以用iscroll解决,隐藏iscroll滚动条,配置时设置hScrollbar和vScrollbar为false即可。

一个常见的思路:在模态框打开是讲外层可滑动的区域设置成overflow:hidden,等关闭模态框之后,在把overflow设置回来

::-webkit-scrollbar{display: none; height: 0; width: 0;}
.selector{
-webkit-overflow-scrolling: touch; 
        overflow-scrolling: touch;
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进