Нужно сделать, чтобы darg and drop работал в браузере по умолчанию андроида (называется Интернет).
Есть демо
Если использовать chrome, то все работает как надо(при перетаскивании элемент движется). Если же использовать браузер по умолчанию, то во время драга ничего не отобразится, а после события touchend элемент окажется на новом месте, то есть обработчик события touchmove отработает. Как сделать, чтобы во время перетаскивания отображалась анимация? (так же, как это выглядит в хроме).
<html>
<head>
<meta charset=utf-8 />
<title>Drag n' drop touch demo - sewa.se</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=0;" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<style type="text/css">
.draggable {
position: absolute;
left: 30px;
top: 30px;
width: 60px;
height: 60px;
margin-left: -30px;
margin-top: -30px;
color: #FFF;
font: bold 16px Helvetica,Arial,Sans-serif;
text-align: center;
background-color: #ABF;
border: 3px solid #669;
}
</style>
</head>
<body>
<div class="draggable">Drag me!</div>
<div class="draggable">Drag me!</div>
</body>
<script type="text/javascript">
$.fn.draggable = function() {
var offset = null;
var start = function(e) {
var orig = e.originalEvent;
var pos = $(this).position();
offset = {
x: orig.changedTouches[0].pageX - pos.left,
y: orig.changedTouches[0].pageY - pos.top
};
};
var moveMe = function(e) {
e.preventDefault();
var orig = e.originalEvent;
$(this).css({
top: orig.changedTouches[0].pageY - offset.y,
left: orig.changedTouches[0].pageX - offset.x
});
};
this.bind("touchstart", start);
this.bind("touchmove", moveMe);
};
$(".draggable").draggable();
</script>
</html>
