使用Touchevent ( jQuery浏览器)在iPhone中拖放
使用Touchevent ( jQuery浏览器)在iPhone中拖放
提问于 2010-11-30 06:34:58
我使用jQuery来监听touchstart、touchmove和touchend，并且能够拖动iphone中的“dragitem”(位置改变了这个位置)。但是现在的问题是，当'dragitem‘拖动到' dropArea’时，我如何才能做出dropArea响应。
例如，'dropArea‘将突出显示/发光，更改背景色，等等，当'dragitem’在'dropArea‘内拖动，但当它离开'dropArea’将保持正常。有什么想法吗？
提前谢谢。
HTML:
<div class='dragArea' >
<div id='box1' class='dragitem'>
</div>
<div id='box2' class='dragitem'>
</div>
</div>
<div class='dropArea'></div>jQuery:
var startTouchX = null;
var startTouchY = null;
var moveTouchX = null;
var moveTouchY = null;
var startPositionX = null;
var startPositionY = null;
$('.dragitem').bind('touchstart',function(event){
event.preventDefault();
var e = event.originalEvent;
startTouchX = e.targetTouches[0].pageX;
startTouchY = e.targetTouches[0].pageY;
startPositionX = $(this).css('left');
startPositionY = $(this).css('top');
});
$('.dragitem').bind('touchmove', function(event){
event.preventDefault();
var e = event.originalEvent;
moveTouchX = e.targetTouches[0].pageX;
moveTouchY = e.targetTouches[0].pageY;
$('#movex').text(moveTouchX);
$('#movey').text(moveTouchY);
$(this).css({top: (moveTouchY - 50), left: (moveTouchX - 5)});
});
$('.dragitem').bind('touchend', function(event){
$(this).animate({top: startPositionY, left: startPositionX}, 'fast');
});Stack Overflow用户
回答已采纳
发布于 2010-12-09 10:09:35
我将检查$('.dragitem')数组和$(‘.dropArea’)的偏移量()。在移动汉德勒..。或者休息一下。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/4311150
复制相关文章
相似问题
腾讯云开发者
