这个js能够将用户的注意吸引到被特殊分割出来的页面,它相当如一个对话框,也就是
说,当用户点击处理过的链接后页面的其他部分间无法使用。
此版本支持Sring,Image,Local element,AJAX。
1.将以下代码放到header部分
<link rel="stylesheet" type="text/css" href="page.css">
<link rel="stylesheet" type="text/css" href="lightbox.css">
<script language="javascript" src="prototype.js"></script>
<script language="javascript" src="mf_lightbox.js"></script>
<script language="javascript">
Event.observe(window, 'load', init, false);
function init() {
Lightbox.init();
}
</script>
2.String
<a href="#" onClick="Lightbox.showBoxString('内容', 300, 200);return false;">String</a>
其中300,200表示框体大小。
String2.Image
<a href="http://www.hotajax.org/download/lightbox/mf_lightbox/images/05.jpg" onClick="Lightbox.showBoxImage(this.href);return false;">Image</a>
3.Local element
<a href="#" onClick="Lightbox.showBoxByID('hiddenDiv', 350, 300);return false;">Local element</a>
you can pass it the ID of an element on the page to be shown in the lightbox. When the lightbox is closed, the element will be hidden and added as the last element within the body
4.AJAX
<a href="#" onClick="Lightbox.showBoxByAJAX('ajax_fragment.html', 150, 300);return false;">AJAX</a>
所加载的内容为单独页面
如果所加载的内容超过用户的窗口它能够自动改变窗口大小(image除外)