admin管理员组

文章数量:1389750

I have an iframe that runs on sites (with a different domain). Can I know within the iframe if it is viable to the user or if the page that this iframe "live in" is active or not. Thanks.

I have an iframe that runs on sites (with a different domain). Can I know within the iframe if it is viable to the user or if the page that this iframe "live in" is active or not. Thanks.

  • javascript
  • iframe
  • cross-domain
Share Improve this question asked Nov 12, 2012 at 20:27 Alon AshkenaziAlon Ashkenazi 1,2234 gold badges21 silver badges29 bronze badges 4
  • 1 You could check if the iframe is clickable. For example document.elementFromPoint(0,0) returns null if that pixel is not visible. Though it also returns null if the iframe was only scrolled away from the screen... – Teemu Commented Nov 12, 2012 at 21:12
  • It's sound like a good direction to look at, but document.elementFromPoint(0,0) return the <html> tag in all scenarios that I checked (the iframe scrooled away, the page isn;t in focus,..), can you please be more specific? – Alon Ashkenazi Commented Nov 13, 2012 at 11:16
  • I made a quicktest in IE9, FF, Chrome and Opera, and only with display: none/block when window.onload was fired in frame page. IE and Chrome returned exactly what I expected (null/HTMLElement). FF gave an error when none, only Opera returned always a HTMLElement. Unfortenately I can't test cross-domain, locally only. I didn't test scrolling, that was rather a guess on basis on my previous experience of elementFromPoint(). Notice, that this check should be done in iframe, not in any main page. – Teemu Commented Nov 13, 2012 at 12:24
  • 2 It seems I've wasted your time, sorry for that. This actually works reliable only in IE. Other browsers seem to find the element even when it is offscreen, and also when visibility:hidden is set. And Opera, it always finds the element :(. Identical behavior with IE is described in developer.mozilla/en-US/docs/DOM/document.elementFromPoint , but obviously this is not true. – Teemu Commented Nov 13, 2012 at 15:58
Add a ment  | 

2 Answers 2

Reset to default 3

This is actually not possible, because you are not able to access the main page that embeds the frame from the frame itself, if you are on a different domain / port / scheme.

If your iframe is on the same domain && port && scheme, you could do this:

<html>
<body>
    <iframe src="frame.htm" id="myframe" style="display:block"></iframe>
</body>
</html>

And the frame.htm:

<script>
    var is_hidden = parent.document.getElementById("myframe").style.display == "none";
    alert(is_hidden ? "I am hidden" : "I am visible");
</script>

Update Overlooked the "from a different domain" - part of the question, updated the post accordingly.

You should check out the Intersection Observer API. I was able to get it to work for two different domains.

Something like this worked for me:

function handleIntersect(entries, observer) {
  console.log('intersecting', entries[0].isIntersecting, 'visible', entries[0].isVisible);
}

let observer;

let options = {
  root: null,
  rootMargin: "0px",
  threshold: [0.5]
};

observer = new IntersectionObserver(handleIntersect, options);
// The DOM element here should be a div that captures the whole content of the iframe.
observer.observe(DOM_ELEMENT);

本文标签： javascriptIs there a way to determine if an iframe is visibleactiveStack Overflow

版权声明：本文标题：javascript - Is there a way to determine if an iframe is visibleactive - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744688371a2619842.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。