首页 文章

jQuery / javascript - 在iframe视图区域中居中div . 在调整iframe高度时,scrollTop不准确

提问于
浏览
0

好吧通常这很容易但是出于视觉原因我强迫我的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>

1 回答

  • 0

    我无法解决这个问题,但我想我会写下我的工作来解决这个问题 . 我把我想要的div放在包含iframe和centerdiv函数的页面上 . 然后在iframe里面的我的代码中我做了以下操作 .

    function CenterDiv(item)
    {
    if (window.location != window.parent.location) parent.CenterDiv(item);      
    }
    

相关问题