iSlider是移动的滑动组件的最佳解决方案。在WEB 轮播图已经变得小儿科的现在，很多人会质疑重新写个移动端的价值？其实移动端与web的环境有很多不同，用户习惯，行为也有很大的差异，而且移动端的浏览器，应用场景和web 端也差别很大。总结一下区别：
移动端用户行为习惯区别(移动端多的是touch 事件，更注重手指与触摸屏的互动)
移动端屏幕(移动的屏幕大多小于C端，为了在更小的屏幕展示同样的内容，内容滑动已然成为用户操作习惯)
移动端多设备性(ipad、iphone、android phone、android pad，以及这些设备的横竖屏状态)
移动设备的更新换代的速度，以及手机浏览器厂商对标准支持的跟进，包括统一的webkit 核心的浏览器
那么iSlider 的出现，解决的根本问题是内容的分屏显示，通过滑动操作来表示上一页内容或是下一页内容。而iSlider 是用最优雅的方式去解决，尽可能的节省内存，提高性能。在功能上iSlider 支持：
图片和dom 两种类型滑动，图片的类型很适合读图类的app，dom 类型则可以根据需要配置成各式各样的webapp
自定义的事件回调，你可以在滑动中，滑动结束，或是滑动开始绑定自己的事件回调
可配置的滑动动画，在获得高性能的同时，你仍然可以指定一些特殊的高级的动画效果来完成你的app，iSlider 提供3d，flip，depth等动画方式来丰富你的滑动效果。
iSlider 会帮你处理好屏幕旋转事件，你只要考虑的是，屏幕旋转后，你的dom 或是 图片改如何显示。
iSlider 还有一些小功能，比如滑动边界递减，自动滑动，垂直水平滑动可配置。
而使用iSlider也非常容易上手，你只需要准备一个dom节点用来存放你的slider：
<div id="canvas"></div>
然后你需要准备展示的数据，这里展示的数据分两种类型，拿图片类型的slider 举例，你只需要准备好的是图片的json 数据，数据格式如下:
var list = [{
height: 475,
width: 400,
content: "../public/imgs/1.jpg",
},{
height: 527,
width: 400,
content: "../public/imgs/2.jpg",
},{
height: 374,
width: 600,
content:"../public/imgs/9.jpg"}];
调用时候，需要对iSlider 实例化：
islider = new iSlider({
data: list,
dom: document.getElementById("iSlider-wrapper"),
isVertical: true,
isLooping: true,
isDebug: true,
isAutoplay: true,
animateType: '3d'});这样就可以运行一个iSlider 的实例了，关于上面一些参数的意义，可以在Demo中看到
讨论这个项目（41）回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约
-
手机端请问你们是怎么适配宽高的？它这个直接就定义了Li的宽高，但这样的问题是考虑到不同手机尺寸手机，图片宽度跟高度肯定不是固定的嘛！你们是怎么用的？
现在只用添加meta标记就行了
<!--适应移动端--> <meta name="viewport" content="width=device-width, initial-scale=1">
-
这个不行啊，插件在CSS里面定义了图片的宽或高，考虑到不同手机的屏幕大小，宽跟高肯定都不能定死的；最好的方法就是能改成图片通过背景来调用，或者不需要固定图片的尺寸自动适应于屏幕！
我改了一下目前没能实现！
各位有没有更好的方案呢?
-
怎么插入背景音乐
<audio controls="controls" autoplay="autoplay"> <source src="音乐地址.mp3" type="audio/mpeg" /> 您的浏览器不支持 audio 标签。 </audio>
要怎么样添加那个跟着图片走的小圆点
-
里面有个dott的参数，设置会有小点出现
-
如何配置的，可以发个代码吗
- 😀
- 😉
- 😥
- 😵
- 😫
- 😘
- 😡
- 👍
- 🌹
- 👏
- 🍺
- 🍉
- 🌙
- ⭐
- 💖
- 💔
- 😀
- 😉
- 😥
- 😵
- 😫
- 😘
- 😡
- 👍
- 🌹
- 👏
- 🍺
- 🍉
- 🌙
- ⭐
- 💖
- 💔
