jquery 在wap端图片列表左右滑动 touch
$(".imgList").find("li").each(function(item){
$(this).on("touchstart", function(e) {
// 判断默认行为是否可以被禁用
if (e.cancelable) {
// 判断默认行为是否已经被禁用
if (!e.defaultPrevented) {
e.preventDefault();
}
}
startX = e.originalEvent.changedTouches[0].pageX,
startY = e.originalEvent.changedTouches[0].pageY;
});
$(this).on("touchend", function(e) {
// 判断默认行为是否可以被禁用
if (e.cancelable) {
// 判断默认行为是否已经被禁用
if (!e.defaultPrevented) {
e.preventDefault();
}
}
moveEndX = e.originalEvent.changedTouches[0].pageX,
moveEndY = e.originalEvent.changedTouches[0].pageY,
X = moveEndX - startX,
Y = moveEndY - startY;
//左滑
if ( X > 0 ) {
if(item > 0) {
clearInterval(autoChange);
changeTo(item-1);
curIndex = item-1;
autoChangeAgain();
}
console.log('左滑');
}
//右滑
else if ( X < 0 ) {
console.log(item);
console.log('右滑');
if(item < 3) {
clearInterval(autoChange);
changeTo(item+1);
curIndex = item+1;
autoChangeAgain();
}
}
//下滑
else if ( Y > 0) {
console.log('下滑');
}
//上滑
else if ( Y < 0 ) {
console.log('上滑');
}
//单击
else{
console.log('单击');
}
});
});
本文来自博客园,作者:秋风2016,转载请注明原文链接:https://www.cnblogs.com/lml2017/p/13253490.html

浙公网安备 33010602011771号