在手机h5页面中,我们经常会有轮播图片的需求。如果你不需要太多的效果,只是简单的手指滑动和自动旋转效果,我推荐swipe插件,但是百度搜索到的插件不是很全,我会添加你可能需要的功能。swipe.js是一个轻量级的js触控滑动库——SwipeJS。这是一个非常小的javascript类库,但是它的功能并不简单。可用于显示网页上的任意内容,支持精确的触摸和移动操作,还可以设置自动播放、比例缩放等实用功能。Swipe功能介绍下面介绍一下SwipeJS的使用。Swipe有如下参数:startSlide:4,//开始图片切换的索引位置auto:3000,//设置自动切换时间,以毫秒为单位continuous:true,//无限循环图片切换效果disableScroll:true,//防止由于触摸导致屏幕滚动stopPropagation:false,//停止滑动事件callback:function(index,element){},//回调函数,切换时触发transitionEnd:function(index,element){}//回调函数,当转换结束时调用这个函数。此外,还有一些比较常用的API方法,如:prev():上一页next():下一页getPos():获取当前页面的索引getNumSlides():获取所有项目slide的个数(index,duration):Swipemethod如何使用Swipe在了解了基本的功能方法之后,我们来看看使用方法。第一个是HTML结构:
