幻灯片/轮播
适合移动手机jQuery幻灯片插件
PetitQ
jflex 是一款小巧的适合移动手机使用的 jQuery 幻灯片插件。该幻灯片插件支持移动触摸，支持鼠标拖拽切换，还支持带进度条的自动播放模式。它是否的小球，使用非常简单。
使用方法:
使用该幻灯片插件需要引入 jQuery，jflex.min.js 和 jflex.min.css 文件。
也想出现在这里？联系我们吧
<link rel="stylesheet" href="css/jflex.min.css" type="text/css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jflex.min.js"></script>
HTML 结构:
该幻灯片使用无序列表的 HTML 结构，每一个
<div class="slider">
<ul class="slides">
<li data-title="Slide 1">
<img alt="" src="1.jpg">
</li>
<li data-title="Slide 2">
<img alt="" src="2.jpg">
</li>
<li data-title="Slide 3">
<img alt="" src="3.jpg">
</li>
</ul>
</div>
初始化插件:
在页面 DOM 元素加载完毕之后，可以通过下面的方法来初始化该幻灯片插件。
$('.slider').jFlex();
也可以在初始化的时候插入一些配置参数：
$('.flex').jFlex({
autoplay: true,
timing: 5000,
titles: 'bottom'
});
配置参数:
autoplay：是否自动播放幻灯片
fx：幻灯片的 slide 元素
timing：幻灯片自动切换的时间。单位毫秒，默认值 5000
titles:幻灯片标签导航的位置。可选值：bottom, top
| 演示地址 | 下载地址 |
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务，详询在线客服！
也想出现在这里？联系我们吧
