Adr*_*ica 40 iframe scroll overflow ios8
我有一个iframe,我需要它有一个滚动溢出.它似乎在桌面上工作,我使用了一个解决方案,使其在iOS中工作.它现在适用于Android和iOS.但是,iOS8失败了.
<html>
<body>
<style type="text/css">
.scroll-container {
overflow: scroll;
-webkit-overflow-scrolling: touch;
}
#iframe_survey {
height: 100%;
}
.scroll-container {
height: 100%;
width: 100%;
overflow: scroll;
}
</style>
<div class="scroll-container scroll-ios">
<iframe id="iframe_survey" src="www.iframe.com" style="border:0px #FFFFFF none;" name="myiFrame" frameborder="0" marginheight="0px" marginwidth="0px" width="100%"></iframe>
</div>
</body>
Run Code Online (Sandbox Code Playgroud)
Usm*_*aja 36
以这种方式使用代码
<div style="overflow:auto;-webkit-overflow-scrolling:touch">
<iframe style="width:100%;height:600px" src="www.iframe.com"></iframe>
</div>
Run Code Online (Sandbox Code Playgroud)
小智 34
为了在iOS上使iframe可滚动,您必须将CSS3属性添加-webkit-overflow-scrolling: touch到父容器:
<div style="overflow:auto;-webkit-overflow-scrolling:touch">
<iframe src="./yxz" style="width:100%;height:100%">
</div>
Run Code Online (Sandbox Code Playgroud)
小智 6
经过数小时测试后,我终于让我的工作了.基本上对我有用的是这个(显示为内联样式演示).使外部div溢出自动使其不会在桌面上显示一组额外的滚动条.
<div style="overflow: auto!important; -webkit-overflow-scrolling: touch!important;">
<iframe src="http://www.mywebsiteurl.com" style="width: 100%; height: 600px; display: block; overflow: scroll; -webkit-overflow-scrolling: touch;" ></iframe>
</div>
Run Code Online (Sandbox Code Playgroud)
小智 0
不知道“www.iframe.com”的另一端是什么......但对我来说,在该文件的 css 中我添加了:
body {
position: relative;
z-index: 1;
width: 100%;
height: 100%;
}
Run Code Online (Sandbox Code Playgroud)
这解决了它。
| 归档时间: |
|
| 查看次数: |
79442 次 |
| 最近记录: |