1. [代码]jQuery Tap插件 简洁tab标签
view sourceprint?
01
$.fn.tap = function(fn){
02
if(!("_tommyfoks_tapPlugin" in window)){
03
window._tommyfoks_tapPlugin = [];
04
}
05
var collection = this,
06
isTouch = "ontouchend" in document.createElement("div"),
07
tstart = isTouch ? "touchstart" : "mousedown",
08
tmove = isTouch ? "touchmove" : "mousemove",
09
tend = isTouch ? "touchend" : "mouseup",
10
tcancel = isTouch ? "touchcancel" : "mouseout";
11
collection.each(function(){
12
var i = {};
13
i.target = this;
14
_tommyfoks_tapPlugin.push(i);
15
$(i.target).on(tstart,function(e){
16
var p = "touches" in e ? e.touches[0] : (isTouch ? window.event.touches[0] : window.event);
17
i.startX = p.clientX;
18
i.startY = p.clientY;
19
i.endX = p.clientX;
20
i.endY = p.clientY;
21
i.startTime = + new Date;
22
});
23
$(i.target).on(tmove,function(e){
24 http://www.huiyi8.com/tab/jianjie/
var p = "touches" in e ? e.touches[0] : (isTouch ? window.event.touches[0] : window.event);
25
i.endX = p.clientX;
26
i.endY = p.clientY;
27
});
28
$(i.target).on(tend,function(){
29
if((+ new Date)-i.startTime<300){
30
if(Math.abs(i.endX-i.startX)+Math.abs(i.endY-i.startY)<20){
31
fn.call(i.target);
32
}
33
}
34
i.startTime = undefined;
35
i.startX = undefined;
36
i.startY = undefined;
37
i.endX = undefined;
38
i.endY = undefined;
39
});
40
});
41
return collection;
42
}
触屏jquery tap 插件代码
精选 转载文章标签 collection jquery 文章分类 jQuery 前端开发
下一篇:requireJs的精简实现
-
【Jquery插件集合】轮播、时间处理插件
【Jquery插件集合】轮播、时间处理插件
jquery css JavaScript -
jquery三种支持手机触屏的插件库
项目涉及到移动设备上的 HTML5 开发,其中需要实现轮播效果。然后最快捷的方式,你知道(Bootstrap),然后原生的 Bootstrap 的 carousel.js 插件并没有支持手势。如下有三种方式:1、下载jquerymobile库文件,导入js文...
javascript ViewUI github jquery Bootstrap -
jQuery触碰显示,不触碰隐藏 代码
jQuery触碰显示,不触碰隐藏
js jquery 触碰隐藏显示 jquery触碰隐藏