jquery制作移动端菜单栏左右滑动
Posted 精灵小公主
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jquery制作移动端菜单栏左右滑动相关的知识,希望对你有一定的参考价值。
//菜单栏滑动
function move_scollX(){
var startPosition, endPosition, distanceX,distanceY;
$(".left").bind(‘touchstart‘, function(e){
var touch = e.originalEvent.changedTouches[0]; //移动端
startPosition = {
x: touch.pageX,
y:touch.pageY
}
}) .bind(‘touchmove‘, function(e){
var touch = e.originalEvent.changedTouches[0]; //移动端
endPosition = {
x: touch.pageX,
y:touch.pageY
};
distanceX = endPosition.x - startPosition.x;
distanceY = endPosition.Y - startPosition.Y;
if(distanceX < 0) { // 向左移动
$(this).css({"left":distanceX});
} else if (distanceX > 0) { // 向右移动
$(this).css({"left":distance});
}
}
}
}).bind(‘touchend‘, function(e){ //放开事件
$(this).animate({"left":-width},100);
}
});
}
以上是关于jquery制作移动端菜单栏左右滑动的主要内容,如果未能解决你的问题,请参考以下文章