lightbox0.5—jquery幻灯片插件

发布于，归属于jquery插件。 前2个座位已被强势霸占！ 共有322人围观    

lightbox

点此下载

第一步：在页面引入插件和JQ库

  1. <script type="text/javascript" src="js/jquery.js"></script>
  2. <script type="text/javascript" src="js/jquery.lightbox-0.4.js"></script

第二步：在页面引入相应的css样式文件

  1. <link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.4.css" media="screen" />
  2. <h4>第三步：在要使用灯箱效果的图片上建立如下结构</h4>
  1. <a href="image1.jpg"><img src="thumb_image1.jpg" width="72" height="72" alt="" /></a>

第四步：初始化插件

  1. $(function() {
  2.     // Use this example, or...
  3.     $('a[@rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
  4.     // This, or...
  5.     $('#gallery a').lightBox(); // Select all links in object with gallery ID
  6.     // This, or...
  7.     $('a.lightbox').lightBox(); // Select all links with lightbox class
  8.     // This, or...
  9.     $('a').lightBox(); // Select all links in the page
  10.     // ... The possibility are many. Use your creative or choose one in the examples above
  11. });
（如果您喜欢这篇教程，可以通过支付宝打赏我们1元哦，拜谢！）

跟作者说两句

:wink: :twisted: :roll: :oops: :mrgreen: :lol: :idea: :evil: :cry: :arrow: :?: :-| :-x :-o :-P :-? :) :( :!: 8-O 8)

2个座位已被强势霸占！

  1. Pingback: jquery插件大全（不断更新中） | ria之家--RIA三部曲：JQ、ext、flex

  2. jintingbo

    写得太好了，正好用上，先谢过

同类