正在加载菜单,请稍待......

lightbox0.5—jquery幻灯片插件

类别:jquery插件

标签:

浏览:100次

明河共影发布于 2009年06月19日

RIA之家技术群:24440797。你可以通过以下方式联络到明河: 1、进入我的微博首页跟随我 2、我的email:riahome@126.com

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. });

订阅RIA之家,及时获取RIA之家最新文章:

本文链接:http://www.36ria.com/170

除非特别说明,本站的所有内容均为原创或翻译,所有权属于文章作者,欢迎转载,转载请注明出处,谢谢。