我在其他地方看到了这个问题,我尝试在这里实现这个解决方案:https ://stackoverflow.com/a/8923541
但是,问题是整个主体随后是可滚动的,因为主体的高度已设置为 iframe 的整体高度。我根本不希望主页滚动(我们为页眉和页脚设置了高度,还有一个 iframe 可以缩放以适应页面的其余高度)。将正文设置为溢出:隐藏会关闭 iframe 中的滚动。
这是我一直在使用的一个简单的测试版本:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
<title>Iframe Test</title>
<script src="js/jquery.js"></script>
<script>
$(function() {
var iframe = $("#frame");
iframe.load(function() {
$("body").height(iframe.height());
});
});
</script>
<style>
body { overflow: hidden;}
#frame {
height: 100%;
width: 100%;
}
#maincontent {
height: 300px;
-webkit-overflow-scrolling: touch;
overflow: scroll;
}
</style>
</head>
<body>
<div id="maincontent">
<iframe src="working2.php" id="frame" name="frame" frameborder='0' scrolling="no">
<p>Your browser does not support iframes.</p>
</iframe>
</div>
</body>
</html>
有没有人得到一个带有单点触摸滚动的 iframe 的实际工作示例?在花了几个小时阅读大量关于它的帖子后,我无法让它工作。我显然做错了什么,但无法弄清楚。