$(document).ready(function(){//全局变量,触摸开始位置 var startX = 0;//, startY = 0; //touchstart :手指放在一个DOM元素上。 //touchmove :手指拖曳一个DOM元素 //touchend :手指从一个DOM元素上移开 $(".main_con_title").on("touchstart", function(e) { //如果提供了事件对象,则这是一个非IE浏览器 if ( e && e.stopPropagation ) //因此它支持W3C的stopPropagation()方法 e.stopPropagation(); else //否则,我们需要使用IE的方式来取消事件冒泡 window.event.cancelBubble = true; startX = e.originalEvent.changedTouches[0].pageX; //startY = e.originalEvent.changedTouches[0].pageY; }); $(".main_con_title").on("touchend", function(e) { //如果提供了事件对象,则这是一个非IE浏览器 if ( e && e.stopPropagation ) //因此它支持W3C的stopPropagation()方法 e.stopPropagation(); else //否则,我们需要使用IE的方式来取消事件冒泡 window.event.cancelBubble = true; moveEndX = e.originalEvent.changedTouches[0].pageX, //moveEndY = e.originalEvent.changedTouches[0].pageY, X = moveEndX - startX; //Y = moveEndY - startY; if ( X > 0 ) { //测试滑动效果是向左滑动 $('.main_con_title ul').animate({left:'0px'},300); } if ( X < 0 ) { //测试滑动效果是向右滑动 $('.main_con_title ul').animate({left:$(document).width()-$('.main_con_title ul').width()+"px"},300); } }); });