I have a Chrome extension that injects an iframe to a web page.
The iframe element has a z-index = 2147483647.
There's another extension installed on my Chrome that does something similar (i.e. injects an iframe with z-index=2147483647).
The other extension's iframe shows ON TOP of my extension's iframe.
On Chrome (and I guess on other browsers), the last element on the page will show top-most. (again - assuming z-index is at the highest value).
I tried changing my extension name so it will invoke last (after the other extension is loaded) and therefore having my iframe injected at the end. It did not work, it seems that the other extension also wants to be the top-most.
Is there anyway to make sure my iframe will be injected right before the </body> tag? after any other element has been injected/loaded?
I've seen this answer as well as this one, which did not help.
I thought about setting a timer and then after all elements were loaded adding my iframe, but it seems kinda hacky, and if there's another extension that does the same, we will end up with a timers-fight :).
Related
I am using 2 Iframe in my index page. If any action is preferred from any Iframe, it must reload that Iframe alone. But it overrides my index page as one of the Iframe URL. Can any one help me to fix this issue.
My expected result is working in Chrome but it not working in Internet explorer
Note: Iframe id and name generated automatically
I used the below command to refresh the Iframe window
window.location.reload(true)
window.top.location.reload(true)
screen reference
Try to reload the specific Iframe element because you're probably reloading the whole page (window) right now.
1- First you must take the name for each Iframe with the name attribute.
2- Later try to use the javascript function document.getElementsByName("IframeName") to retrieve the specific Iframe. After that you can take the resulting object (the Iframe) to apply the changes you need (to change the src attribute).
IMPORTANT: Remember that iframes are neither supported by every browsers nor HTML5.
Hope it helps you...
I'd like for the opener of an iframe to be able to detect each time the user changes pages within that iframe. Using jQuery, I can detect each time a page finishes loading within an iframe via the following:
$('#myIframe').on('load', function() {/*do stuff*/});
However, I'd also like to detect (in the iframe opener) each time a page starts loading within that iframe.
Note: The content that is displayed in the iframe is from a third-party site, so I don't have the ability to insert code there so that the iframe can explicitly alert the opener.
Does anyone know of an event that is fired when a page begins loading? I'm not having much luck finding anything via Internet searches, as most people seem to only be interested in detecting when the iframe has finished loading.
It seems unfortunately that the only way to be sure it will work in most browsers is to use the <iframe onload="myonloadscript();"
The window.onload event of the main page will tell you when the iframe has loaded and you can be sure it has begun it's request for it's src page
Edit:
Just copying it from an article (Their are hacks for this)
doing this cross-domain? Not so easy. You’ll get something along the line of: Child document does not have the right to access parent document. In fact there is a lot of documentation on the web about how to achieve it, but the problem is that it is often outdated, with solutions that often only works in a couples of browsers.
For example:
I have a main page with an iframe in it and my iframe contains a button. When I press the button inside the iframe some scripts are executed, and the design of iframe is changed. Texts appears and other stuff.
How do I detect when iframe scripts are run? (Or the button was pressed?)
The iframe is from a different domain.
If the contents of the iframe come from a different domain than the outside page, then you can't - the browser deliberately stops you from being able to tell much about what is going on inside the iframe. What you can do though is grab the URL the frame is pointing to if it changes.
If it's running in the same domain, you can just access the elements inside the iframe pretty much the same way as you would normally via the document property of the iframe
If the main page and the iframe are on the same domain, you can make the javascript in the iframe call a function or access the elements of the parent frame.
So at the end of the script in the iframe you can do
parent.script_is_finished();
If you have control over the script in the iframe, you could use window.postMessage to communicate with your main page, even if they are in different domains.
Support for this is limited to FF3+, IE8+, Chrome, Safari(5?), Opera10+
Here's a demo on html5demos.
As an update to the fact that the iframe is from a different domain:
Short answer: No. You can't detect clicks within an iframe from another domain.
Longer but still short answer: The reason you can't is the same reason you can change the contents of the iframe -- it'd be a security risk unless the iframe is on the same domain. You simply can't track user activity within an iframe sourced from a different domain.
Sorry, but I hope that helped!
I was studying how Disqus and other embedded wigets are implemented, and I came to realize that they don't use an enclosing iframe where all their widget is run. What they do is to append elements dynamically to the embedding page through JavaScipt and then run almost every form or button in some iframe. What's the point of doing this? Couldn't they just wrap everything in an iframe and then change the parent window URL (to allow navigation) through some kind of cross-domain messaging system such as easyXDM? Can anybody point out some benefits that arise from having some elements not inside an iframe?
Code inside an iframe may not be able to set cookies as browser thinks it is an advertisement.
Iframe content cannot control the size of the outside iframe, so iframe needs to be created with javascript and javascript needs to be loaded externally so that external site has total over iframe size.
Happy new year :)
I have a Chrome extension which is a popup that contains an iframe, inside that iframe i load a whole web app. my question is
How can i communicate with the code inside that iframe form popup.html or from the background page? I would need to either read DOM elements inside that iframe or better be able to make js calls to different methods.
Thanks for all the help!
Use a content script that loads inside that frame. They can access the DOM of that page and make calls to the background page, though it's a bit harder to be able to communicate with the JavaScript on that page - but DOM elements should be fine if you control both the iframe and the extension.
See http://code.google.com/chrome/extensions/content_scripts.html