获取相对于窗口的IFRAME位置

Get IFRAME position relative to the window

本文关键字：IFRAME 位置 窗口 相对于 获取      更新时间：2023-09-26

我在一个iframe中运行javascript代码，该iframe来自与父窗口不同的域。由于安全问题（跨域），我无法轻易检测到框架在窗口内的位置。

然而，我发现，如果我将事件附加到框架中的window.mousemove，我可以获得窗口的ScreenX/Y和事件的ScreenX/Y，这让我很清楚浏览器窗口左上角的偏移量，这对我来说足够近了——我只想检测框架是否在视图中以及有多少在视图中。

所以我想我可以在iframe中实际地触发window.mousemote（），但随后是事件。ScreenX/Y未填充。

所以我的问题是：

1） 当框架在不同的域上时，如何从窗口获得iframe的绝对偏移2） 或者——同样好的是——我如何务实地激发一个填充了ScreenX/Y的事件？

这样的东西对我有用，尽管我不确定这是否正是你想要的。有两件事你可能仍然需要考虑：

  1. 从浏览器滚动偏移量，但我认为这个值可以供您使用

  2. 浏览器标头的差异，我当前获得的值没有扣除浏览器标头使用的高度，也没有扣除左侧的任何填充。不过，有几种方法可以做到这一点。

    a） 创建一个浏览器列表，并自动推断出标题可能有多大的最佳猜测。b） 使用innerHeight进行一些计算，但您仍然需要计算出窗口状态栏（或unix或max）与浏览器标题大小之间的大小。

总之，这是我使用的代码：

<html>
    <head>
        <title>iframe title</title>
        <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script type="text/javascript">
        jQuery(document).ready(function(){
           $(document).mousemove(function(e){
                var x = e.screenX - e.pageX - window.screenX;
                var y = e.screenY - e.pageY - window.screenY;
              $('#status').html(x +', ' + y );
           }); 
        })
        </script>       
    </head>
    <body id="doc">
        <h2 id="status">0, 0</h2>
    </body>
</html>
相关文章：