Lightbox popup in main window from image in iframe - javascript

I have an image gallery placed in an iframe (not cross domain) and would like to use Lightbox to show a popupdiv in the main frame. Because right now when the image in the iframe is clicked, the popup div just covers the iframe.
I think it might have something to do with setting target="_top", but that doesn't quite do the trick. Setting the window.top location to my main url just causes the page to go to that url.

<iframe> cannot access its parent contents unless the parent frame provides a co-operative Javascript.
Instead of embedding your gallery directly via <iframe> you should embed it using a helper Javascript.
Then this helper Javascript would communicate with <iframe> Javascript via postMessage()
and the helper Javascript would do the required DOM manipulation on top level for opening an overlay <div> in the top level frame.
https://developer.mozilla.org/en/DOM/window.postMessage

Related

How to get links in an iframe I don't control to open in parent window

Is this even possible?
Background
I have a page that's basically just a logo and an iframe.
I have complete control over the parent page and can use whatever tricks I want (html, javascript, php, etc.).
The page in the iframe, however, is a third party page that I have very little control over. I can use no javascript, no css, I can't even modify any links. All I can do is modify some text.
Problem
I only need the logo on the initial page. Once the user logs in or clicks to a different page, I want that new page to open in the parent window. I know about target="_top" and target="_parent", but those won't help me because I have no real access to the links in the iframe.
Question
Is there any attribute I can put on the iframe or javascript I can use in the parent page that will force new pages in the iframe to load in the parent window?

How jquery or javascript access DOM in iframe?

I want jquery or javascript to access DOM in Iframe.
For example, I make a iframe to show amazon.
then I wanna get a banner image link on amazon.
Can I do this?
and I have one more problem.
if I click amazon banner that is made a by _blank target on "a" Tag in a iframe,
browser make a new tab. but I wanna see a new page in a iframe.
You cannot do that if the origin of the iframe is different from the parent document :
https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy

Open links from an external website that sits in an Iframe in a new window

I have a website with an iframe on one page that goes to an external URL (which I have no control over). I am trying to find a way to have all the links in the Iframe (not the entire page) open in a new window. I've tried a couple solutions with no luck. Is there a way I can target the iframe and use the HTML base tag?
Due to the Same Origin Policy, you can only modify the contents of an iframe if the domains and protocols match.

resizing iframe during jQuery animations

I am creating content that will be loaded in an iframe by another site.
Certain links on the (iframed) page load content via Ajax and then show/hide it using the slideToggle (jQuery animation) function.
I found Resizing an iframe based on content great help in assigning the iFrame the correct height on page-load, but how can I increase the iFrame's height as the content changes dynamically (without reloading a page)?
You can't interact with a different domain's DOM in the means of JS from inside the iframe changing the properties of the iframe itself. Or otherwise, JS from the main document, inspecting/altering the DOM from inside.
You'd be better off loading the iframe's contents per AJAX as well.

What are the benefits of not using an iframe to embed one site in another?

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.

Categories

Resources