Javascript масштабирование и поворот с помощью gesturechange и gestureend

Я работаю над некоторыми сенсорными событиями и жестами, я хочу иметь возможность масштабировать и вращать объект, я успешно сделал его перетаскиваемым, но жесты вызывают у меня проблемы. Жесты работают, но они прерывистые: когда вы зажимаете его для увеличения или уменьшения или пытаетесь повернуть его, он перескакивает с пальца на палец.

Вот мой код для справки.

var width = 300; var height = 300; var rotation = 0;
$('.dynamic').live("gesturechange gestureend", function(e){
var orig = e.originalEvent;

if(e.type == 'gesturechange'){
    e.preventDefault();
    $(this).css("width", parseFloat(width) * orig.scale);
    $(this).css("height", parseFloat(height) * orig.scale);
    $(this).css("-webkit-transform","rotate(" + ((parseFloat(rotation) + orig.rotation) % 360) + "deg)");
}else if(e.type == 'gestureend'){
    a.w[ids] = parseFloat(width) * orig.scale;
    a.h[ids] = parseFloat(height) * orig.scale;
    a.rotation[ids] = (parseFloat(rotation) + orig.rotation) % 360;
}
});

Есть ли способы сделать это плавным и предотвратить выпрыгивание из пальцев, или я ошибся в подходе. Нужны подсказки, уловки и помощь

нашел решение.

Похоже, что событие моего касания для перетаскивания мешало жестам, поэтому оно продолжало прыгать с пальца на палец, вместо этого можно было не использовать жесты подсчитайте касания к объекту и используйте вместо этого касания начала, конца и изменения.

Вот код

var touches = 0; var width = 300; var height = 300; var rotation = 0;
$('.dynamic').live("touchstart touchmove touchend", function(e){
var orig = e.originalEvent;   

if(e.type == 'touchstart'){
 if(orig.touches.length == 1){
    touches = 1; 
 }else if(orig.touches.length == 2){
    touches = 2;
 }
}else if(e.type == 'touchmove'){
 e.preventDefault();
 if(touches == 2){
        $(this).css("width", parseFloat(width) * orig.scale);
        $(this).css("height", parseFloat(height) * orig.scale);
        $(this).css("-webkit-transform","rotate(" + ((parseFloat(rotation) + orig.rotation) % 360) + "deg)");
 }
}else if(e.type == 'touchend'){
    if(touches == 2){
        a.w[ids] = parseFloat(width) * orig.scale;
        a.h[ids] = parseFloat(height) * orig.scale;
        a.rotation[ids] = (parseFloat(rotation) + orig.rotation) % 360;
    }
}
});