手机端jQuery触屏滑动图片切换特效代码

手机端jQuery触屏滑动图片切换代码是一款触屏滑动图片左右滚动展示代码。(function ($) { $.fn.leftScroll = function (option) { var data = { isOneScreen: true, isScroll: true }; var options = $.extend(data,option); this.each(function () { var that = this; var len = $(this).find(".leftScroll_picBox").length; var clone = $(this).find(".leftScroll_picBox").clone(true); var clone2 = $(this).find(".leftScroll_picBox").clone(true); $(this).children().append(clone); $(this).children().append(clone2); var width = $(this).find(".leftScroll_picBox").eq(0).innerWidth(); var left = len; var container = $(this).children(); container.css("left",(-left*width)+"px"); var touch1,touch2,pageX1=0,pageX2=0,pageY1=0,pageY2=0; var startHandle = function (that) { container.addClass("transition"); touch1 = that.originalEvent.touches[0]; pageX1 = touch1.pageX; pageY1 = touch1.pageY; }; var moveHandle = function (that) { touch2 = that.originalEvent.touches[0]; pageX2 = touch2.pageX; pageY2 = touch2.pageY; if(Math.abs(pageY2-pageY1)>Math.abs(pageX2-pageX1)){ return }else { that.preventDefault(); container.css("left",((-left*width)+(pageX2 - pageX1))+"px"); } }; var endHandle = function (that) { var deltaX = pageX2 - pageX1; var deltaY = pageY2 - pageY1; if(Math.abs(deltaY)>Math.abs(deltaX)){ container.css("left",(-left*width)+"px"); return }else { if(deltaX<0){ if(left<((len*2)+1)){ left=left+1; container.css("left",(-left*width)+"px"); if(left===((len*2)+1)){ setTimeout(function () { container.removeClass("transition"); container.css("left",-len*width); left = len; },200) } $(that).on("touchstart",startHandle) } }else { if(left>0){ left=left- 1; container.css("left",(-left*width)+"px"); if(left===0){ setTimeout(function () { container.removeClass("transition"); container.css("left",-len*width); left = len; },200); $(that).on("touchstart",startHandle) } } } } }; if(options.isScroll===true){ $(that).on("touchstart",startHandle); $(that).on("touchmove",moveHandle); $(that).on("touchend",endHandle); } }); }})(jQuery);

在线演示        积分下载        6毛下载        砍两刀下载