how can i open iframe in Javascript lightbox

I am using a statics page where I want to open a iframe in the lightbox.

<iframe width="560" height="315" src="http://ift.tt/1vPWPbP" frameborder="0" allowfullscreen></iframe>  

Can I get a help in fixing this issue.

I am using a lightbox, which is working fine with the image. ButI want to make it work with iframe. I want to open an iframe inside the lightbox. If i am placing the iframe in the place of large image it not working.

$(".sol-body")
        .on("click", ".primary-image, a.enlarge, img.enlarge", function( event ){
            event.preventDefault();
            event.stopPropagation();
            if ( $("a.enlarge").length != 0 ) {
                createOverlay();
                $(".overlay-img").append("<img src='" + $(".larger-img").attr("src") + "' />");
                animateOverlay(); 
            }             
        })
        .on("click", "li img", function( event ){
            event.preventDefault();
            createOverlay();
            $(".overlay-img").append("<img src='" + $(this).attr("src").replace("mini", "main") + "' />");
            animateOverlay();
        });

    function createOverlay() {
        $("body").append("<div class='overlay'><div class='overlay-img'></div><div class='overlay-close'>x</div></div>");

        $(".overlay")
            .on("click", function( event ){
                event.stopPropagation();
                $(".overlay").off("click");
                $(".overlay").remove();
            })
            .on("click", ".overlay-close", function( event ){
                event.stopPropagation();
                $(".overlay").off("click");
                $(".overlay").remove();
            })
            .on("click", ".overlay-img", function( event ){
                event.stopPropagation();
            });
    };

    function animateOverlay() {
        $(".overlay").animate({ "background-color" : "rgba(0, 0, 0, .85)" }, 200);
    };

});

Fiddle