html手机端页面底部弹出页面,手机端弹层弹出的内容可以滑动，底部内容不能滑动...

woshiajuana

哈哈哈哈，遇到我实习期碰见的事情了，主要是网上给的建议还不行；手机body、html都设置了height:100%,overflow：hidden,是不能够阻止的给出我一个比较蛋疼的解决方案：如果你的弹出层是半透明的话，我这个方案会出现很蛋疼的事情如果弹出的内容可以滑动的话，那么你弹出层出现的那一刻，你就不能够阻止浏览器的默认事件，不然的话，弹出的弹层无法滚动；弹出层想滚动，简单弹出层的样式是position:fixed;top:0;left:0;right:0;bottom:0;当然也可以是position:absolute;如果是绝对定位，就需要一定的布局结构了重要的来了，一定要加一个overflow-y:auto，加了这个就会可以滚动了然后想要手机底层内容不滑动，你就在弹出层弹出的那一刻给body加一个样式：position:fiexd;一加上这个样式，底部内容会立马滚动到顶部，如果你弹层有动画，就在动画执行结束之后，再加上这个样式，如果你弹出层是半透明的，蛋疼就能看到底部立马滚动到顶部的这个效果。关闭弹层，去掉body上加的那个样式即可如果你问那底部内容滚动到顶部了怎么办，这个又要蛋疼一下了，你得在给body加样式之前，先记录一下body滚动的高度，然后在关闭的弹层之前，去掉body样式之后立马给body赋上这个滚动高度即可关闭弹层的流程：    点击关闭弹层的按钮——先去掉body样式——给body赋滚动高度——关闭弹层好了，希望能解决你的问题