jQuery orbit 幻灯片
在线实例
使用方法
- <div class="wrap" style="width: 565px; height: 290px; margin: 0 auto;">
- <div id="featured">
- <a class="orbit-item" href="#" data-caption="#htmlCaption1"><img src='/images/loading.gif' data-original="images/img1.jpg" ></a>
- <img src='/images/loading.gif' data-original="images/img4.jpg" data-caption="#htmlCaption5">
- <a href="#"><img src='/images/loading.gif' data-original="images/img2.jpg" ></a>
- <div class="orbit-item" style="background-color: #eee; text-align: center; line-height: 290px;">这是一个空的div,可以放 html代码、视频等等</div>
- <a href="#" data-caption="#htmlCaption3"><img src='/images/loading.gif' data-original="images/img3.jpg" ></a>
- </div>
- <span class="orbit-caption" id="htmlCaption1">这是幻灯片<strong>1</strong>的标题</span>
- <span class="orbit-caption" id="htmlCaption3">这是蝙蝠侠吗?</span>
- <span class="orbit-caption" id="htmlCaption5">没有链接的幻灯片</span>
- </div>
- <script type="text/javascript" src='/images/loading.gif' data-original="http://apps.bdimg.com/libs/jquery/1.7.2/jquery.min.js"></script>
- <script src='/images/loading.gif' data-original="js/jquery.orbit.min.js"></script>
- <script>
- $(window).load(function() {
- $('#featured').orbit({
- 'bullets' : true,
- 'captionAnimation' : 'slideOpen'
- });
- });
- </script>
复制
下载
原标题:jQuery orbit 幻灯片
关键词:jquery
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。