移动Web内容滑块类库 – Swipe JS

Swipe JS 是一个轻量级(仅3.7 kb)的移动Web浏览内容滑块类库，它可用来展示任意的HTML内容，支持精确的触摸移动，并能提供类似原生程序的操作体验，如智能缩放幻灯片大小等。它也不依赖于任何 JavaScript 框架，定制性也比较高，提供了4个可选的配置参数。

首先引入 Swipe JS 类库及相关的 CSS 文件

<script type=”text/javascript” src=”swipe.min.js” ></script>
<link rel=”stylesheet” type=”text/css” href=”css.css”/>

添加用于呈现幻灯的 HTML 代码

<div id=’slider’>
<ul>
<li style=’display:block’></li>
<li style=’display:none’></li>
<li style=’display:none’></li>
</ul>
</div>

可选的参数说明

startSlide: (默认:0)起始幻灯
speed: (默认:300)幻灯片切换速度
auto: 幻灯片自动切换的间隔时间(毫秒)
callback: 回调函数，切换时触发

初始化

var slider = new Swipe(document.getElementById(‘slider’), {
    startSlide: 3,
    speed: 500,
    auto: 4000,
    callback: function(event, index, elem) {
    // …
    }
});

 

Swipe下载地址：http://www.kuaipan.cn/file/id_82777686379857351.htm