jQuery弹出层插件LIGHTBOX

 查看演示  website  立即下载

说明文档   引入资源，(JQ1.3+)和JS文件.

<script type="text/javascript" src="js/jquery.min.js"></script>
  <!--lightbox开始-->
  <link rel="stylesheet" type="text/css" href="js/lightbox/themes/default/jquery.lightbox.css" />
  <!--[if IE 6]>
 <link rel="stylesheet" type="text/css" href="js/lightbox/themes/default/jquery.lightbox.ie6.css" />
<![endif]-->
  <script type="text/javascript" src="js/lightbox/jquery.lightbox.min.js"></script>
  <script type="text/javascript">
    jQuery(document).ready(function($){
      $('.lightbox').lightbox();
    });
  </script>
  <!--结束-->

<a href="images/a1.jpg" class="lightbox">这是一个最简单的弹层</a>

<a href="images/a1.jpg" class="lightbox" rel="pic">数组类设置属性"rel"</a>
<a href="images/a1.jpg" class="lightbox" rel="pic">数组类设置属性"rel"</a>
<a href="images/a1.jpg" class="lightbox" rel="pic">数组类设置属性"rel"</a>

<a href="images/a1.jpg?lightbox[width]=400&lightbox[height]=400" class="lightbox">弹出层固定大小</a>

<a href="images/a1.jpg?lightbox[maximized]=true" class="lightbox">弹出层随浏览器窗口滚动</a>

<a href="test.html?lightbox[width]=350&lightbox[height]=170" class="lightbox">弹出层加载html文件,注意需要指定层大小</a>
<a href="http://player.youku.com/player.php/sid/XNzU0NjEzODU2/v.swf?lightbox[width]=700&lightbox[height]=400" class="lightbox">弹出层加载swf视频文件,注意需要指定层大小</a>

PREVIOUS:
NEXT:
js贪吃蛇
JQ省市区三级联动选择插件