I have a page with an iframe. The link inside an iframe should open colorbox. It works fine.

But it opens the colorbox inside the iframe. Is it possible to open the iframe over the parent window.

I appreciate any help.

     $(function() {
          $('#ajax').colorbox({iframe: true });
     });

I have a page with an iframe. The link inside an iframe should open colorbox. It works fine.

But it opens the colorbox inside the iframe. Is it possible to open the iframe over the parent window.

I appreciate any help.

     $(function() {
          $('#ajax').colorbox({iframe: true });
     });

• javascript
• jquery
• modal-dialog
• colorbox

3 Answers 3

You should be able to trigger it in the top frame with

top.$.fn.colorbox({ params });

Although you'll need to spoon-feed it the data you want showing.

Had the same problem. solved by putting a function in the parent page like the one below:

<script>    
$(document).ready(function(){
function call_colorBox(params) {
        $.colorbox(params);
    }
})
</script>

then call the colorbox function in your iframe using:

<script>
top.parent.call_colorBox({ width: "80%", height: "80%", iframe: true, href:"http://www.google." });
</script>

above code is not working for me..

top.parent.$.colorbox({ 
    iframe: true, 
    width: "75%", 
    height: "75%",
    href: "frmTATABomPartsUnique.aspx?Parts=Common",
    title: "UNIQUE PARTS", 
    onComplete: function () {
        $("#cboxClose").attr("title", "Close"); 
    } 
});

This code working...