Closing a Lightbox from an iFrame
This is a follow up post to an article I wrote a few weeks ago about Lightbox Using iFrames Instead of AJAX.
That article described how to use an iFrame to display content in a Lightbox without using AJAX. There are advantages to this and you can read about them at the link above.
Traditionally a Lightbox could be closed using the code below:
-
<a href="#" class="lbAction" rel="deactivate">Close Lightbox.</a>
This code will only work if the link is being called from the same window that the lightbox is defined in, which presents a problem with our iFrame Lightbox because the iFrame is a separate window and knows nothing about the Lightbox defined in the parent.
Two parts are required to achieve closing a Lightbox from an iFrame. The first is a JavaScript function in the parent that can be called from the child window(iframe).
Parent Code
-
function closeLightbox() {
-
lightbox.prototype.deactivate();
-
}
The second is the call in the child window to the parent function closeLightbox
iFrame(child) Code
-
window.parent.closeLightbox();
Throw the above code into a link or button click and the Lightbox will be closed.
Download Complete Source (includes demo)
lightbox-iframe2.zip (15k)
Special thanks to Manuel Ribeiro. This code is based off of his implementation.
My name is Noah Everett. I live in Tulsa, OK. I started 
Finally got to put this script to the test and it works great...thanks Noah.
I am using this and it does in fact close the window, however.... it does not bring the browser back to the scroll position in IE like the close button does... any suggestions?
For example, the link that launches the lightbox is at the bottom of the page. The div is loaded, but the user clicks the close window link. It returns them to the top of the page, not the bottom where they were originally.
Any help would be greatly appreciated... this script is great!
It appears that in the deactivate: function()
this.setScroll(0,this.yPos);
the this.yPos is empty
I can't seem to pass the yposition to the setScroll