jQuery Lightbox是一个很棒的展示图片的效果js库,对于最新的1.5.1版,简单说明如下:

  1. 在网页头部包含必须的库文件,包括js:jQueryjQuery lightBox:
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.lightbox-0.4.js"></script>
    其中jquery.js也可以选择直接链接Google或者微软等提供的在线版本,相比部分虚拟主机,速度可能更快

    https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js
    http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.min.js

    以及css文件:
    <link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.4.css" media="screen" />

  2. 激活使用jQuery lightBox插件。具体做法是在头部写一段javascript,例如:

    <script type="text/javascript">
    $(function() { 
       $(‘a[@rel*=lightbox]’).lightBox(); 
    // 对所有a链接标记的rel属性为lightBox,经过测试1.5.1新版不起作用,说是不支持的方法
      $(‘#gallery a’).lightBox(); 
    // 对选择器#gallery内的a标签其作用,也就是id为gallery的div内链接作用  
      $(‘a.lightbox’).lightBox();
    // 对页面内class为lightBox的所有链接作用   
      $(‘a’).lightBox();
    // 页面内所有的链接作用 
    });
    </script>