当前位置: 代码迷 >> HTML/CSS >> html5页面在手机上指头左右滑动
  详细解决方案

html5页面在手机上指头左右滑动

热度:962   发布时间:2013-08-14 14:27:55.0
html5页面在手机上手指左右滑动
html5在手机上手指左右滑动切换页面,哪位大虾做过,给个列子 
例如:http://imag.jimi.com/dx/
html5 手机 css3

------解决方案--------------------
这个有何难啊,使用 touchwipe.js 很简单的就能实现了
------解决方案--------------------
你发的另外一个贴子我回复了。
------解决方案--------------------
引用:
Quote: 引用:

这个有何难啊,使用 touchwipe.js 很简单的就能实现了
能给个列子不?

<script>jq1.9min.js</script>
<script>
(function(a){
a.fn.touchwipe=function(c){
var b={
drag:false,
min_move_x:20,
min_move_y:20,
wipeLeft:function(){/*向左滑动*/},
wipeRight:function(){/*向右滑动*/},
wipeUp:function(){/*向上滑动*/},
wipeDown:function(){/*向下滑动*/},
wipe:function(){/*点击*/},
wipehold:function(){/*触摸保持*/},
wipeDrag:function(x,y){/*拖动*/},
preventDefaultEvents:true
};
if(c){a.extend(b,c)};
this.each(function(){
var h,g,j=false,i=false,e;
var supportTouch = "ontouchstart" in document.documentElement;
var moveEvent = supportTouch ? "touchmove" : "mousemove",
startEvent = supportTouch ? "touchstart" : "mousedown",
endEvent = supportTouch ? "touchend" : "mouseup"


/* 移除 touchmove 监听 */
function m(){
this.removeEventListener(moveEvent,d);
h=null;
j=false;
clearTimeout(e)
};

/* 事件处理方法 */
function d(q){
if(b.preventDefaultEvents){
q.preventDefault()
};
if(j){
var n = supportTouch ? q.touches[0].pageX : q.pageX;
var r = supportTouch ? q.touches[0].pageY : q.pageY;
var p = h-n;
var o = g-r;
if(b.drag){
h = n;
g = r;
clearTimeout(e);
b.wipeDrag(p,o);
}
else{
if(Math.abs(p)>=b.min_move_x){