Ske*_*ets 6 html css iframe mobile-safari ios
我在移动iOS Safari中遇到了一个问题,当在iFrame内部拖动时,在包含iFrame的div中滚动是不可能的:
#outside{
height: 400px;
width: 200px;
background: blue;
overflow: scroll;
}
.space{
height: 200px;
width: 200px;
background: red;
}
iframe{
height: 1000px;
width: 200px;
background-color: green;
}The green section is the iFrame.... Scrolling on the green section in iOS mobile is the issue
<div id="outside">
<div class="space"></div>
<iframe>
</iframe>
<div class="space"></div>
</div>因此,在iFrame上拖动时,由于它没有滚动,因此它应该滚动父页面,而是滚动整个页面.
这个bug有任何已知的解决方法吗？它已经在Android上运行了.
将你的<iframe>s 放入包装纸中-webkit-overflow-scrolling: touch;
.iContainer {
-webkit-overflow-scrolling: touch;
}
#outside {
height: 400px;
width: 200px;
background: blue;
overflow: scroll;
}
.space {
height: 200px;
width: 200px;
background: red;
}
iframe {
height: 1000px;
width: 200px;
background-color: green;
border: none;
display:block;
}
iContainer {
-webkit-overflow-scrolling: touch;
}The green section is the iFrame.... Scrolling on the green section in iOS mobile is the issue
<div id="outside">
<div class="space"></div>
<div class="iContainer">
<iframe>
</iframe>
</div>
<div class="space"></div>
</div>特别注意：position:relative与on结合使用会<body>导致 IoS 设备有时会阻止滚动。让它完全从“弹跳”状态恢复可以修复它，但仍然感觉错误和有问题。因此，请确保您的或上
没有任何设置。最近我花了一些时间来调试这个。position<body><html>