Как настроить функцию передвижения кружочка?

#javascript #jquery

Есть функция которая отвечает за перемещение, кружочка по тач-событиям. Но проблема
в том, что курсор то обгоняет сам кружочек то отстает. 

Как сделать так, чтоб кружочек двигался равномерно, вслед за пальцем при этом не
обгонял и не отставал ?

Сам код :



var target;

$('.circle').on("touchstart", function() { 
target = $(this);
});

var moove = function (obj, x, y){
  $(obj).css({"left" : x });
  $(obj).css({"top" : y });
}
    
 $(window).on("touchmove", function(e) {  
   moove($(target), event.targetTouches[0].screenX, event.targetTouches[0].screenY ); 
 });
.circle {
  width: 50px;
  height: 50px;
  border-radius: 100%;
  background: green;
  position:   absolute;
}

 




фидл: https://jsfiddle.net/dxnxpybe/21/
    

Ответы

Ответ 1

А Вы пробовали изменить screenX и screenY на clientX clientY, вроде как кружочек
следует за пальцем.

var target;

$('.circle').on("touchstart", function() { 
  target = $(this);
});

var moove = function (obj, x, y){
  $(obj).css({"left" : x });
  $(obj).css({"top" : y });
}

$(window).on("touchmove", function(e) {  
  moove($(target), event.targetTouches[0].clientX, event.targetTouches[0].clientY ); 
});


https://jsfiddle.net/appcscme/1/