【CSS】手机端div设置overflow-y:scroll时怎么阻止body页面的滚动？

图片描述

例如滚动白色弹出层时到底部时继续滚动就会使背景也滚动，怎么阻止比较好？

回答：

将不需要滚动的部分使用fixed定位，滚动的地方使用absolute定位；实现内部滚动

回答：

对局部需要滚动条的元素，尝试使用这个css属性：

-webkit-overflow-scrolling: touch;

我之前解决类似的问题时参考过这篇文章：http://weblog.west-wind.com/posts/2013/Jun/01/Smoothing-out-div-scroll...

回答：

暴力式：

cssbody {
    height: 100%;
    overflow: hidden;
}

回答：

lz这个问题解决了吗?

回答：

两种方法，1.设置body：fixed.2.设置body height:100%,设置body的子元素div高度100%，overflow：hidden

回答：

这个问题今天我也遇见了，网上查了半天没有一个靠谱的，所以自己琢磨了半天终于解决，操作如下：
当同时为html，body两标签都添加css样式：height: 100%;overflow: hidden;才能阻止body滚动条滚动，一般都会是动态添加样式，这样写就可以：
$('html').css("height":"100%","overflow":"hidden"});$('body').css({"height":"100%","overflow":"hidden"});
启用设置： $('html').css({"overflow":"auto"});$('body').css({"overflow":"auto"});
拿走不谢。

回答：

阻止事件冒泡到document上

document.querySelector('.luckingboy').addEventListener('touchmove', function(e) {
    e.stopPropagation();
})

或者这样写

document.addEventListener('touchmove', function (e) {
    if (e.target.nodeName == '#document') {
        e.preventDefault();
    } else {
        e.stopPropagation();
    }
})

另外，ios微信浏览器内网页可以上下拖动，如要禁止，需要阻止touchmove的默认行为

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

但是，这样做，页面中需要滚动的div也就不能滚动了。可以使用iScroll来滚动！

以上是 【CSS】手机端div设置overflow-y:scroll时怎么阻止body页面的滚动？ 的全部内容， 来源链接： utcz.com/a/156126.html

回到顶部