JSFiddle - React, Tailwind, and code Playground

by jruddell

HTML

<script src="http://colorpowered.com/colorbox/core/colorbox/jquery.colorbox.js"></script>
<link rel="stylesheet" href="http://colorpowered.com/colorbox/core/example1/colorbox.css">
<a class="example7 cboxElement" href="http://google.com">Outside Webpage (Iframe)</a>

JavaScript

$(".example7").colorbox({
    width:"80%", 
    height:"80%", 
    iframe:true,
    onComplete: function(a1){
        var self = this;
        var getFrame = function(cb){
            var me = this, a = arguments,
                frame = $('#cboxLoadedContent').find('iframe');
            
            if(frame.length === 0) 
                setTimeout(function(){ getFrame.apply(me,a); }, 20);
            else cb.call(self, frame.eq(0));
        };
        
        getFrame(function(frame){
            // use frame contents (bind events, etc)
            frame.one('load', function(){
                $(this).contents(); /* ... etc */
            });
        });
    }
});