手机的touch事件(基于jquery)

javascript代码:

$.swipe=function(opt){
  var o = $.extend({
    mainSelector:"",
    swipeLeft:function(e,v){},
    swipeRight:function(e,v){},
    swipeEnds:function(v,e){}
}, opt || {});
  var startX=0,startY=0;
var obj={
    touchStart: function (e){
        var touchx= e.touches[0].pageX;
        var touchy= e.touches[0].pageY;
        startX = parseInt(touchx,10);
        startY = parseInt(touchy,10);
    },
    touchMove:function(e){
        var touchmx= e.touches[0].pageX,
        touchmy= e.touches[0].pageY,
        dirX=parseInt(touchmx-startX,10);
        dirY=parseInt(touchmy-startY,10);
        if(dirX<0){
            o.swipeLeft(e,dirX);
        }else{
           o.swipeRight(e,dirX);
        }
        
        if(dirY<0){
            o.swipeTop(e,dirY);
        }else{
            o.swipeBottom(e,dirY);
        }
    },
    touchEnd:function(e){
       o.swipeEnds(e);
    },
    bindEvent:function(els){
        var elem=$(els);
        for(var i=0,_len=elem.length;i<_len;i++){
          elem[i].addEventListener(‘touchstart‘, obj.touchStart, false);
          elem[i].addEventListener(‘touchmove‘, obj.touchMove, false);
          elem[i].addEventListener(‘touchend‘, obj.touchEnd, false);
        }
    }
};
obj.bindEvent(o.mainSelector);
return obj;
}; 

 

传入的是选择器和swipeLeft,swipeRight的回调事件

手机的touch事件(基于jquery),,5-wow.com

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。