Linking an iframe to open in Lightbox

Question

Is it possible to use a link to link to an iFrame of content that opens in a lightbox or fancybox?

EG; View my Graphic Design Gallery Click Here > Lightbox displayin

Answer 1

I use shadowbox and do this. Download and reference in the shadowbox javascript and css. Then you can use the following to view the iframe inside a shadowbox. The iframe can contain anything (including a iframe).

Make a link in your body:

Click Me!

Then on click of that event, do the following on DOM Ready.

$(document).ready(function(){
    $('.modal').click("click", function(e){
        e.preventDefault();             // Prevent the default action
        var url = $(this).attr('href'); // Get the iFrame href
        Shadowbox.open({
            content:    url,
            player:     "iframe",
            height:     400,
            width:      510
        });
    });
});