JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://iaian7.com/js/mediaboxAdv-1.5.4.js"></script>
CSS
/* mediaboxAdvanced Light theme */
/* version 2.5 - June 2011 */
/* for mediaboxAdvanced v.1.5.x */
/* Overlay background styling */
#mbOverlay {
position: fixed;
z-index: 9998;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #ccc;
cursor: pointer;
}
/* Fixes for older or limited browsers */
#mbOverlay.mbOverlayOpaque {
background: transparent url(/images/mediaboxAdv/80.png) repeat;
}
#mbOverlay.mbOverlayAbsolute {
position: absolute;
}
#mbOverlay.mbMobile {
position: absolute;
background-color: transparent;
}
/*
#mbBottom.mbMobile {
line-height: 28px;
font-size: 24px;
}*/
/* Overlay panel styling */
#mbCenter {
position: absolute;
z-index: 9999;
left: 50%;
padding: 10px;
background-color: #fff;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#000000'); /* For IE 5.5 - 7 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#000000')"; /* For IE 8 */
-webkit-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
-khtml-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
-moz-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
}
#mbCenter.mbLoading {
background: #fff url(/images/mediaboxAdv/loading-light.gif) no-repeat center;
/* This style is applied only during animation. */
/* For example, the next lines turn off shadows */
/* improving browser performance on slow systems. */
/* To leave shadows on, just remove the following: */
-webkit-box-shadow: none;
-khtml-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
#mbMedia {
position: relative;
left: 0;
top: 0;
/* Inline content styling */
font-family: Myriad, Verdana, Arial, Helvetica, sans-serif;
line-height: 20px;
font-size: 12px;
color: #000;
text-align: left;
background-position: center center;
background-repeat:...
JavaScript
Mediabox.open('http://www.youjoomla.com', 'Youjoomla', '500 280');