Busting out of iframe from source page to display modal on parent (top) page

Question

I'm trying to get a modal window to bust out of my iframe onto the top page when a user clicks the image in the iframe, that will display a video on the main (parent) page. I have the following, but not sure how to implement the JavaScript to push a modal window from the iframed page to the top page.

This is the iframe code that will go onto a parent page:

<iframe id="rtv-preview-frame" src="syndicateplayer.html" name="preview-frame" frameborder="0" noresize="noresize"></iframe>

I'm trying to figure out what I need to have on my syndicateplayer.html page, in order to push the content of a modal to the top page as a modal window on top. Looking around at some options, it looks like I would need something similar to this on the page that is in the iframe:

var $jParent = window.parent.jQuery;
var dlg1 = $jParent('.rtv-video');
dlg1.dialog();

I have tried this, but not able to get the div to push out of the iframe on click. Any suggestions?

Answer 1

The solution I found is to use http://www.ericmmartin.com/projects/simplemodal/, and using this to push the modal to the parent from the iframe: open modal window from iframe into the parent