html - iframe 中的 Fullpage.js 无法在 IOS 移动设备上滚动
<p><p>我正在使用 Fullpage.js 创建一个包含部分的全页网站。我通过全屏 iframe 在不同的域上使用不同的语言。 </p>
<p>虽然我无法在 IOS 移动设备上滚动页面。 </p>
<p>当使用以下解决方案时，页面根本无法滚动:</p>
<pre><code><iframe src="http://url.com/" style="border: 0; position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%">
</code></pre>
<p>当我使用这个版本时，我可以滚动一会儿然后它就会出错:</p>
<pre><code><style>
.demo-iframe-holder {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
-webkit-overflow-scrolling: touch;
overflow-y: scroll;
}
.demo-iframe-holder iframe {
height: 100%;
width: 100%;
}
</style>
<body>
<div class="demo-iframe-holder">
<iframe src="http://url.com/">
</div>
</code></pre>
<p>有没有人可以解决这个问题？
Iframe 中的网站位于此处:<a href="http://tinyurl.com/j9heupj" rel="noreferrer noopener nofollow">http://tinyurl.com/j9heupj</a> </p></p>
<br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
<p><p>使用以下代码解决:</p>
<pre><code><style>
iframe {
overflow: scroll !important;
width: 100%;
height: 100%;
border: none;
}
div {
height: 100%;
width: 100%;
position: fixed;
}
body {
margin:0;
}
@media (max-width: 780px) {
div {
position:absolute;
}
}
</style>
<body>
<div>
<iframe src="http://www.website.com/">
</div>
</body>
</code></pre></p>
<p style="font-size: 20px;">关于html - iframe 中的 Fullpage.js 无法在 IOS 移动设备上滚动，我们在Stack Overflow上找到一个类似的问题：
<a href="https://stackoverflow.com/questions/34292238/" rel="noreferrer noopener nofollow" style="color: red;">
https://stackoverflow.com/questions/34292238/
</a>
</p>
页:
[1]