javascript - 如何在手机上实现弹出框弹出时,弹出框内可以上下滚动,背后的页面锁定不能滚动?
黄舟
黄舟 2017-04-10 16:47:02
0
3
664

想要在手机的页面上弹出框弹出来的时候,背后的页面内容锁定不能上下滚动,只有弹出框内的内容可以滚动。关闭弹出框的时候让页面再恢复可上下滚动状态。弹出框是自己编写的一个p。onmousewheel="return false;"只有在PC上才好使,在手机上不适用。
然后找到了这个

document.addEventListener('touchmove', function (event) { event.preventDefault();}, false);

但又会无差别的把整个boby的内容都禁止滚动,实现不了需求。
请问有没有大神有其他的解决方法?

黄舟
黄舟

人生最曼妙的风景,竟是内心的淡定与从容!

reply all(3)
刘奇

弹窗的时候body 加 overflow: hidden; 关闭的时候就去掉,就可以

Peter_Zhu

弹出拟态窗口的时候给body设置:

html,
body {
    height: 100%;
    overflow: hidden;
}

关闭拟态窗口就:

html,
body {
    overflow: visible
}
Peter_Zhu

手机上都没有onmousewheel属性

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template