I have been trying to get some assistance with this issue for a while now. I know this issue has been discussed before but I can't seem to get it to work. I have a master html page with an iframe on that page. I am using jquery prettyphoto and I was wondering how I can get the light box to display in the parent window when I click on the link in the iframe?
Please see my code below:
Master Page:
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>Master Page</title>
- </head>
- <body>
- <p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p><p>Test</p>
- <iframe src="iframe.html" width="300" height="300px" frameborder="0"></iframe>
- </body>
- </html>
iFrame Page:
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>iframe</title>
- <style type="text/css" media="screen">
- @import url("assets/css/infotech-iframes.css");
- @import url("assets/css/infotech-popup.css");
- </style>
- <script src="assets/js/jquery.js" type="text/javascript" charset="utf-8"></script>
- <script src="assets/js/jquery.popup.js" type="text/javascript" charset="utf-8"></script>
- </head>
- <body>
- <a href="assets/images/screenshots/campaign-setup-lg.png" rel="prettyPhoto[gallery]"><img src="assets/images/screenshots/campaign-setup-sm.gif" /></a>
- <script type="text/javascript" charset="utf-8">
- $(document).ready(function(){
- $("a[rel^='prettyPhoto']").prettyPhoto();
- });
- </script>
- </body>
- </html>
Thanks