好像是需要用到touchmove事件,可否贴出代码来参考一下,或者比较好用的插件,谢谢
我建议自己写,移动端主要是 通过 touchstart 、touchmove、和 touchend来实现拖动效果。
可以写这样一段小小的代码 :
var ele = document.getElementById("drag");
var moving = function(e){
/.......
}
var mouseup = function(e){
/.......
document.removeEventListener("touchmove", moving);
document.removeEventListener("touchend", mouseup);
}
ele.addEventListener("touchstart",function(e){
event.preventDefault();
item.set_prop("isMoving", true);
document.addEventListener("touchmove", moving,false);
document.addEventListener("touchend", mouseup,false);
},false);
注意点:
1.必须在拖动出发的时候禁用屏幕滚动和缩放,比如 上面的event.preventDefault();
2.必须在拖动完成之后remove 之前注册的事件。
请叫我最亚伦。。哈哈
function dropImg(obj){
$(obj).on('touchstart',function(event){
var disx=event.originalEvent.changedTouches[0].clientX-$(obj).offset().left;
var disy=event.originalEvent.changedTouches[0].clientY-$(obj).offset().top;
var moveFlag=true;
$(document).on('touchmove',function(event){
event.preventDefault();
if(moveFlag){
$(obj).css({
"left":event.originalEvent.changedTouches[0].clientX - disx,
"top":event.originalEvent.changedTouches[0].clientY - disy
});
}
});
$(document).on('touchend',function(){
moveFlag=false;
})
});
}
10 回答11.1k 阅读
6 回答3k 阅读
5 回答4.8k 阅读✓ 已解决
4 回答3k 阅读✓ 已解决
2 回答2.6k 阅读✓ 已解决
3 回答5.1k 阅读✓ 已解决
3 回答1.8k 阅读✓ 已解决
你可以查看jQuery UI
Touch Punch
, 你会为之惊叹的。看这个:http://touchpunch.furf.com/