jQuery slidizle 幻灯片
jQuery广告幻灯片进度条，水平/左右切换，垂直/上下切换，自动播放，缩略图列表切换
在线实例
| 默认效果 | 水平/左右切换 | 垂直/上下切换 | 循环 |
| 自动播放 | 缩略图 | 进度条 | 回调函数 |
使用方法
- <div class="sucaihuo" data-slidizle>
- <ul data-slidizle-content>
- <li style="background-image: url('img/01.jpg')"></li>
- <li style="background-image: url('img/02.jpg')"></li>
- <li style="background-image: url('img/03.jpg')"></li>
- </ul>
- <div data-slidizle-next>
- <i class="fa fa-arrow-right"></i>
- </div>
- <div data-slidizle-previous>
- <i class="fa fa-arrow-left"></i>
- </div>
- <ul data-slidizle-navigation></ul>
- </div>
- <script src="js/jquery.slidizle.js"></script>
- <script>
- $(function() {
- $('.sucaihuo').slidizle();
- });
- </script>
参数详解
| 参数 | 描述 | 默认值 |
| timeout | 幻灯片播放间隔 | null |
| pauseOnHover | 鼠标悬停暂停播放 | false |
| nextOnClick | 鼠标悬停暂停播放 | false |
| loop | 循环播放 | false |
| autoPlay | 自动播放 | false |
| keyboardEnabled | 键盘支持 | true |
| touchEnabled | 触摸事件支持 | true |
| loadBeforeTransition | 预加载 | true |
disabled | ||
| onInit | 幻灯片被单击后的回调函数 | null |
| beforeChange | 幻灯片切换前的回调函数 | null |
| onChange | 幻灯片切换时的回调函数 | null |
| afterChange | 幻灯片切换后的回调函数 | null |
| beforeLoading | 加载幻灯片钱的回调函数 | null |
| onLoading | 加载幻灯片时的回调函数 | null |
| afterLoading | 加载幻灯片后的回调函数 | null |
onNext | ||
onPrevious | ||
| onPlay | 开始自动播放时的回调函数 | null |
| onPause | 暂停播放时的回调函数 | null |
| onResume | 恢复后的回调函数 | null |
云盘内容
| 文件 | jQuery插件大全打包 |
| 内容 | HTML5+CSS3+PHP+jQuery等示例 |
| 大小 | 170M（300+个文件） |
注意：示例只是当前的内容，【下载】的是全部jQuery插件一起打包后的文件。