我在其他地方看到了这个问题,我尝试在此处实施此解决方案:https://stackoverflow.com/a/8923541
但问题是,整体可以滚动,因为正文的高度已经设置为iframe的整体高度。我不希望主页面完全滚动(我们有一个标题的高度,页脚和一个iframe,它可以缩放以适应页面高度的其余部分)。将body设置为overflow:hidden将关闭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的实际工作样本?我花了几个小时的时间来阅读并阅读大量关于它的帖子后,我无法让它工作。我显然做错了什么,但无法理解。