<div id="dilog">
<div id="dilog_in">
<a href="Javascript:closeDialog()"><img src="<?PHP echo base_url(); ?>images/close.png" class="close_dialog" /></a>
<iframe scrolling="auto" id="dialog" width="0px" height="0px" frameborder="0" src="" ></iframe>
</div>
</div>
<script language="javascript">
function dialog(w,h,src){
$("#dilog").animate({ opacity: "show" }, "fast");
$("#dialog").width(w);
$("#dialog").height(h);
var window_width = $(window).width();
var pad_left = (window_width/2)-(w/2);
if(pad_left <1){pad_left = 1;}
$("#dilog").css("left",pad_left);
$("#dialog").attr("src",src);
}
function closeDialog(){
$("#dilog").animate({ opacity: "hide" }, "normal");
$("#dialog").attr("src","");
}
</script>
<style type="text/css">
#dilog{
display:none;
background:url('../images/loading.gif') no-repeat center center #fff;
position:absolute;
border:10px solid #555;
-webkit-box-shadow: rgba(0, 0, 0, 0.9) 0 0 3px;
-moz-box-shadow: rgba(0, 0, 0, 0.9) 0 0 3px;
box-shadow: rgba(0, 0, 0, 0.9) 0 0 3px;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
top:50px;
}
#dilog_in{
position:relative;
}
#dilog .close_dialog{
position:absolute;
right:-40px;
top:-40px;
width:50px;
height:50px;
}
</style>