5 html scroll overlay css3 ios7
我只是调试一个奇怪的场景,一旦覆盖层中的滚动运动到达其边界,它就会传递给底层元素.因此,当叠加层没有滚动空间时(因此当您敲击弹性顶部/底部时),背景层开始滚动.
我尝试了几个解决方案,并检查了这个:防止身体滚动但允许叠加滚动
但到目前为止还没有修复.我已经附上了一个plunker,所以当你在iphone或ipad中打开它时,你会看到效果.
想象一下,我们有以下页面结构:
<html>
<body>
<nav> <!-- The overlay -->
<div></div> <!-- The scrollable container with appropriate overflows -->
</nav>
<div class="page-wrap"></div> <!-- Main content starts to scroll when overlay reaches bounds or ios top/bottom bars are displayed -->
</body>
</html>
干杯!
Plunkr:http: //run.plnkr.co/g4WQrNibWNbz5lYr/
**注意:当显示ios标题和底栏时,似乎会出现问题.我将尝试添加视频以供进一步说明**
小智 3
是的，这很烦人。尝试在换页上使用-webkit-overflow-scrolling: touch覆盖层和-webkit-transform: translateZ(0) 。希望能帮助到你。