码迷,mamicode.com
首页 > Web开发 > 详细

jQuery Tap插件

时间:2015-06-15 23:27:53      阅读:674      评论:0      收藏:0      [点我收藏+]

标签:

$.fn.tap = function(fn){
    var collection = this,
        isTouch = "ontouchend" in document.createElement("div"),
        tstart = isTouch ? "touchstart" : "mousedown",
        tmove = isTouch ? "touchmove" : "mousemove",
        tend = isTouch ? "touchend" : "mouseup",
        tcancel = isTouch ? "touchcancel" : "mouseout";
    collection.each(function(){
        var i = {};
        i.target = this;
        $(i.target).on(tstart,function(e){
            var p = "touches" in e ? e.touches[0] : (isTouch ? window.event.touches[0] : window.event);
            i.startX = p.clientX;
            i.startY = p.clientY;
            i.endX = p.clientX;
            i.endY = p.clientY;
            i.startTime = + new Date;
        });
        $(i.target).on(tmove,function(e){
            var p = "touches" in e ? e.touches[0] : (isTouch ? window.event.touches[0] : window.event);
            i.endX = p.clientX;
            i.endY = p.clientY;
        });
        $(i.target).on(tend,function(e){
            if((+ new Date)-i.startTime<300){
                if(Math.abs(i.endX-i.startX)+Math.abs(i.endY-i.startY)<20){
                    var e = e || window.event;
                    e.preventDefault();
                    fn.call(i.target);
                }
            }
            i.startTime = undefined;
            i.startX = undefined;
            i.startY = undefined;
            i.endX = undefined;
            i.endY = undefined;
        });
    });
    return collection;
}

 

jQuery Tap插件

标签:

原文地址:http://www.cnblogs.com/jackson-leung/p/4579285.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!