I'm using Hammers library for my app. How can I drag my element from any point that I touch and not by center ? thanks !
var hammertime = Hammer(document.getElementById('contentTab'), {
transform_always_block:true,
transform_min_scale: 1,
drag_block_horizontal: true,
drag_block_vertical: true,
drag_min_distance: 0,
drag_max_touches: 2,
release: false
});
var rect = document.getElementById('tabella');
var posX=0, posY=0,
scale=1, last_scale,
rotation= 1, last_rotation,
dt =0;
hammertime.on('touch doubletap drag transform', function(ev) {
switch(ev.type) {
case 'doubletap':
if (dt == 0){
dt=1;
scale = 2;
}else if (dt ==1){
dt = 0;
scale = 1;
posX=0;
posY=0;
}
last_rotation = rotation;
break;
case 'touch':
last_scale = scale;
last_rotation = rotation;
break;
case 'drag':
posX = ev.gesture.deltaX;
posY = ev.gesture.deltaY;
break;
case 'transform':
// rotation = last_rotation + ev.gesture.rotation;
scale = Math.max(1, Math.min(last_scale * ev.gesture.scale, 10));
break;
}
// transform!
var transform =
"translate3d("+posX+"px,"+posY+"px, 0) " +
"scale3d("+scale+","+scale+", 0) " ;
"rotate("+rotation+"deg) ";
rect.style.transform = transform;
rect.style.oTransform = transform;
rect.style.msTransform = transform;
rect.style.mozTransform = transform;
rect.style.webkitTransform = transform;
});