A Zepto JS plugin that creates

#Zepto.pageSlider

基于Zepto的移动端多功能滚动模块插件

A Zepto JS plugin that creates the various slider modules.

Readme for En

##使用方法

step.1 引入 zpeto.js 及插件

<script type="text/javascript" src="path/to/zepto.js"></script> <script type="text/javascript" src="path/to/zepto.pageSlider.js"></script>

step.2 HTML Element

<div id="container"> <div class="page"> page1 </div> <div class="page"> page2 </div> <div class="page"> page3 </div> </div>

step.3 初始化

<script type="text/javascript"> Zepto(function($){ var $container = $("#container"); $container.pageSlider({ loop:false, easingTime:600 }); }); </script>

##可选参数及默认值

$container.pageSlider({ pageSelector: ".page", //页面DOM使用的selector，默认为`.page` height: windowHeight, //默认为window高。可传入百分比（按父级百分比），或 px 值 width: windowWidth, //默认为window宽。可传入百分比（按父级百分比），或 px 值 horizontal: false, //默认为竖直排布scroll，可以水平 autoSpeed: 5000, //自动播放速度 auto: false, //是否自动播放 loop: true, //是否循环播放 percentThreshold: 10, //拉动超过百分比时翻页 easing: 'ease-out', //缓动函数方式 `linear`, `ease`, `ease-out` easingTime: 400, //缓动延迟 pageCss: {}, //page额外的css(不接受height,width,会被覆盖) prevBtn: null, //向前翻页按钮 nextBtn: null, //向后翻页按钮 beforeMove: function($currentPage, $toPage, toIndex){}, //翻页前callback afterMove: function($fromPage, $currentPage, currentIndex){} //翻页后callback });

##注意

##更多例子

examples

##兼容性

( 真机测试机型有限。欢迎提交 issue )

##License

MIT