模拟iphone桌面切屏carousel小类库

1）做什么的：

由于翻遍jquery mobile,也没有找到满意的，模拟iphone桌面切屏功能类库。

分享一个最近写的carousel小类库，第一次发布，难免有些bug，后续维护。

主要针对智能移动设备，模拟iphone桌面切屏的小js类库。

2）代码和示例地址：github：https://github.com/withasi/es_Carousel

一个示例说明：http://182.92.83.234/carousel/

3）类说明如下：

　　

/************** define： start  **************/
/**
* @class:  Carousel类
* @example  var testCarousel = new es.Carousel("view","content")
* @param overviewEl {HTMLElement|String} 为视角容器，为视角容器，即 Carousel的视角
* @param contentEl {HTMLElement||String} 为上边容器的子容器，内容区的容器，宽度为page之和，为page页面的父容器
* @param options {Object} 构造设置，参数说明：
*           {
clientWidth : window.innerWidth, //客户区宽度
clientHeight : window.innerHeight, //客户区高度
swipeTime:300,//切换时间，单位为ms
pageSwitchThred:100,//页面切换阈值，单位为px。表示当左右切换时，当切换的宽度为大于pageSwitchThred时，无论速度，在弹起时均切换
isIndicator:true,//是否创建指示器
useTransform:true, //如果没有采用transform,则直接通过改变style的top和left属性
useTransition:true //如果没有采用Transition,则设定style的top和left作为变换属性，而非指定transform
}
* @public
*/

4）应用举例如下：

/************** example： start  **************/
<div class="view" id="view">
<div id="content" class="carouselContent">
<div class="contentpage">
<p>page 1</p>
</div>
<div class="contentpage">
<p>page 2</p>
</div>
<div class="contentpage">
<p>page 3</p>
</div>
</div>
</div>
</body>
<script type="text/javascript">
window.onload = function(){
/**
* @description:  Carousel类
* @param overviewEl {HTMLElement||String} 为视角容器，为视角容器，即 Carousel的视角
* @param overviewEl {HTMLElement||String} 为上边容器的子容器，内容区的容器，宽度为page之和，为page页面的父容器
* @param options {Object} 构造设置
*           {
clientWidth : window.innerWidth, //客户区宽度
clientHeight : window.innerHeight, //客户区高度
swipeTime:300,//切换时间，单位为ms
pageSwitchThred:100,//页面切换阈值，单位为px。表示当左右切换时，当切换的宽度为大于pageSwitchThred时，无论速度，在弹起时均切换
isIndicator:true//是否创建指示器
}
* @type {*}
*/
var testCarousel = new es.Carousel("view","content");
}
</script>
/************** example： end  **************/