如何检测元素在跨域父级上的iframe中是否可见

时间:2012-04-02 13:03:20

标签: javascript html dom cross-domain visibility

正如问题所述,我有一个跨域父级的iframe。如果该内容滚动到视图中或在页面加载时已在视图中,我需要触发事件。正常检查页面顶部/侧面的距离和视口高度/宽度似乎不起作用,因为它们在iframe中测量页面。

我无法在父页面上编辑/添加任何内容来启用此功能,所有内容都必须位于iframe内。

这背后的原因是记录内容是否曾有机会被用户查看,或者是否已将其加载到视图之外并保留在那里。

有些公司为广告提供这项服务,但就发现它是如何实际完成而言,它似乎是黑暗艺术之一。

非常感谢任何帮助。

编辑:我所谈到的提供此项服务的公司的两个例子。

  1. 查看(4)下的第一个标记 http://www.doubleverify.com/what-is-verification/
  2. 他们首先声明他们可以在右侧进行http://adxpose.com/home.page

4 个答案:

答案 0 :(得分:5)

spider.io可能会使用浏览器计时攻击。他们的页面上有一个视频:

http://www.spider.io/viewability/

这是关于某些浏览器计时攻击如何工作的很好的报告:http://www.contextis.com/documents/2/Browser_Timing_Attacks.pdf

答案 1 :(得分:1)

简单的答案是,你不能

由于原始政策相同,您无法使用ECMAscript访问跨域iframeDOMwindow object)。

答案 2 :(得分:0)

您确定这些示例仅以iframe为基础吗?也许他们需要在父窗口中添加一些javascript。

如果你真的需要这个,并且不需要100%的准确度,我会尝试一些基于时间的技术,假设大多数浏览器将优化图形工作发生在视野之外。

实际上,我认为在合理的时间内使用这些技术获得良好的结果或者期望一个通用的强大的跨浏览器解决方案是不可能的。这会很有趣。

答案 3 :(得分:0)

doubleverify和adxpose使用“离线”技术来确定广告是否可见,在页面视图中不会发生。如果他们是通过Javascript完成的,那么您只需查看其中一个像素即可查看其工作原理。