search

Home  >  Q&A  >  body text

javascript - 怎样解决点击弹出层之后禁止页面滚动?

场景:手机页面点击购买弹出商品的一些参数(一个弹出层,背景有个黑色遮罩),
给body添加 ,在模拟器上好好地,一上手机出现诡异的问题?
不知各位前辈是怎么解决的?

overflow:hidden;
height:100%;
巴扎黑巴扎黑2918 days ago677

reply all(6)I'll reply

  • 伊谢尔伦

    伊谢尔伦2017-04-11 10:28:00

    -webkit-transform: translateZ(0);
        transform: translateZ(0)
    

    看看body的CSS中有没有类似这样的,上次碰到过这个问题,把这两句删除就OK了,用别人的CSS就是会出现莫名的问题

    reply
    0
  • 巴扎黑

    巴扎黑2017-04-11 10:28:00

    position: fixed; 是可以的

    reply
    0
  • 黄舟

    黄舟2017-04-11 10:28:00

    document.removeEventListener("touchmove", function (e) {

    e.preventDefault();

    }, false)
    // 禁止页面滚动

    reply
    0
  • 天蓬老师

    天蓬老师2017-04-11 10:28:00

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

    reply
    0
  • PHPz

    PHPz2017-04-11 10:28:00

    不要给body添加

    reply
    0
  • PHP中文网

    PHP中文网2017-04-11 10:28:00

    在移动端下要把 body和html都设置为 overflow:hidden;height:100%; 就不会飘啦 亲测有用。

    然而昨天还是入了坑。蒙层下的页面如果高度超过页面显示高度就会跑到顶端了。
    最后的解决方法是 给蒙层加禁止移动的事件,如果蒙层上面还有滚动的页面也不影响的。

      $(".dialog-box-bg").bind("touchmove", function (e) {
                e.preventDefault();
            });
    

    reply
    0
  • Cancelreply