Colorbox

http://www.jacklmoore.com/colorbox/
http://www.jacklmoore.com/colorbox/example5/

 <script type="text/javascript" charset="utf-8">
$(document).ready(function() {
/* Automatically resize to content */
var y = $(document.body).height();
var x = $(document).width();
parent.$.colorbox.resize({innerWidth:x, innerHeight:y});

$("#button_cancel").click(function() {
parent.$.colorbox.close();//注:塗聚文
return false;
})
});


</script>

 <button id="button_cancel" type="button">cancel</button>
 <script language="javascript" type="text/javascript">    
			$(document).ready(function(){			
          	$(".iframe").colorbox({iframe:true, "80%", height:"80%"});
          	$(".iframe").colorbox({
				        onOpen:function(){ alert('onOpen: colorbox is about to open'); },
					onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
					onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
					onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); }
					onClosed:function(){ alert('關閉窗口'); window.location='Index.aspx';} //關閉時的狀態//注:塗聚文
					});
          	
			$(".callbacks").colorbox({
					onOpen:function(){ alert('onOpen: colorbox is about to open'); },
					onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
					onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
					onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
					onClosed:function(){ alert('onClosed: colorbox has completely closed'); } //關閉時的狀態
				});

			$("#click").click(function(){ 
					$('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
					return false;
			});
          
});
      
    </script> 
原文地址:https://www.cnblogs.com/geovindu/p/3559083.html