jQuery eislideshow 图片轮播

在线实例

基础演示

自动播放

使用方法

1. <div id="ei-slider" class="ei-slider">
2. <ul class="ei-slider-large">
3. <li>
4. <img src="data:images/large/4.jpg" alt="image04" />
5. <div class="ei-title">
6. <h2>
7. <a href='#' target='_blank'>手风琴菜单</a>
8. </h2>
9. <h3>
10. 手风琴
11. </h3>
12. </div>
13. </li>
14. </ul>
15. <ul class="ei-slider-thumbs">
16. <li class="ei-slider-element">Current</li>
17. <li><a href="#">Slide 1</a><img src="data:images/thumbs/1.jpg" alt="thumb01" /></li>
18. <li><a href="#">Slide 2</a><img src="data:images/thumbs/2.jpg" alt="thumb02" /></li>
19. <li><a href="#">Slide 3</a><img src="data:images/thumbs/3.jpg" alt="thumb03" /></li>
20. </ul>
21. </div>

复制

1. $(function() {
2. $('#ei-slider').eislideshow({
3. easing: 'easeOutExpo',
4. titleeasing: 'easeOutExpo',
5. titlespeed: 1200
6. });
7. });

复制

参数详解

参数	描述	默认值
eislideshowAPI参数
animation	动画效果。sides || center	sides
autoplay	自动播放	false
slideshow_interval	轮播间隔时间，单位毫秒	3000
speed	焦点图滑动动画时间	800
titlespeed	标题滑动动画时间	800
thumbMaxWidth	缩略图最大尺寸	150

---

下载