/* * swiper初始化 */ var swiper1 = new Swiper('.swiper1', { loop:false, grabCursor: true, onSlideChangeStart: function(){ var index=swiper1.activeSlide; $(".p1").html(index+1); swiper2.swipeTo (index); }, onTouchEnd:function(){ /*手指滑动时,判断手指滑动的方向*/ // alert(swiper1.slides.length); goprev(); /*上一篇*/ gonext(); /*下一篇*/ }});
/* * 滑到上一篇 */function goprev(){ var startX, startY, moveEndX, moveEndY, X, Y; $(".swiper1 .swiper-slide:first").on("touchstart", function(e) { // e.preventDefault(); startX = e.originalEvent.changedTouches[0].pageX, startY = e.originalEvent.changedTouches[0].pageY; }); $(".swiper1 .swiper-slide:first").on("touchmove", function(e) { // e.preventDefault(); moveEndX = e.originalEvent.changedTouches[0].pageX, moveEndY = e.originalEvent.changedTouches[0].pageY, X = moveEndX - startX, Y = moveEndY - startY; if ( Math.abs(X) > Math.abs(Y) && X > 0 ) { //从左侧向右滑动 $.afui.loadContent("#article",false,false,"slide"); } }); }/* * 滑到下一篇 */function gonext(){ var startX, startY, moveEndX, moveEndY, X, Y; $(".swiper1 .swiper-slide:last").on("touchstart", function(e) { // e.preventDefault(); startX = e.originalEvent.changedTouches[0].pageX, startY = e.originalEvent.changedTouches[0].pageY; }); $(".swiper1 .swiper-slide:last").on("touchmove", function(e) { // e.preventDefault(); moveEndX = e.originalEvent.changedTouches[0].pageX, moveEndY = e.originalEvent.changedTouches[0].pageY, X = moveEndX - startX, Y = moveEndY - startY; if ( Math.abs(X) > Math.abs(Y) && X < 0 ) { //从右侧向左滑动 $.afui.loadContent("#article",false,false,"slide"); } }); }
判断手指滑动的方向:
Document 移动端,手指滑动屏幕查看效果。