好的,通常这很容易,但出于视觉原因,我强制 iframe 与其包含的内容高度相同。这样做只给了我一个滚动条,即父窗口上的滚动条。iframe 文档从不滚动。当我尝试在 iframe 中居中 div 时,问题就来了。当页面向下滚动几页时,我无法获得准确的滚动顶部值。$(window).scrollTop() 始终为零。如果我使用 parent.document.documentElement.scrollTop 而不是 $(window).scrollTop() 我会得到一个值,但它完全是午餐。例如,如果 iframe 的高度是 2011 并且我滚动到 iframe 的底部并查询 parent.document.documentElement.scrollTop 我得到一个值 567 返回。我的屏幕尺寸是1200
所有浏览器的结果相同。测试最新的IE、FF、Opera、Chrome。
模拟
in outerdoc.htm I have
<iframe id="myFrame" src="doc1.htm"></iframe>
doc1.htm:
<html>
<head>
<title>my title</title>
</head>
<body>
<p> 10 pages of content near the bottom <div onclick="CenterDiv($('#myDiv'))">show div</div></P>
<div id="myDiv"></div>
<script type="text/javascript" language="javascript">
$(document).ready(function()
{
$('#myFrame', top.document).height($(document).height()); //sets height of frame to document within
});
function CenterDiv(item)
{
var mtop = ($(window).height() / 2 - item.height() / 2) + $(top.window).scrollTop());
item.css('top', mtop < 0 ? 0 : mtop );
}
</script>
</body>
</html>