我试图在手势期间触发这些警报,而不是在手势结束后。因此,在缩放手势期间,当刻度为0.5或更小时,或者当刻度大于1.0时。
Hammer.js:http://eightmedia.github.io/hammer.js/
到目前为止,这是我的代码:
var hammertime = Hammer(document.body, {
transform_always_block: true,
transform_min_scale: 0,
drag_block_horizontal: true,
drag_block_vertical: true,
drag_min_distance: 0
});
var posX = 0,
posY = 0,
lastPosX = 0,
lastPosY = 0,
bufferX = 0,
bufferY = 0,
scale = 1,
last_scale,
rotation = 1,
last_rotation,
dragReady = 0;
hammertime.on('touch drag dragend transform transformend', function(ev) {
if ((" " + ev.target.className + " ").indexOf(" dataCard ") < 0) return;
else manageMultitouch(ev, ev.target);
});
function manageMultitouch(ev, element) {
switch (ev.type) {
case 'touch': last_scale = scale;
last_rotation = rotation;
return;
case 'dragend':
lastPosX = posX;
lastPosY = posY;
return;
case 'drag':
posX = ev.gesture.deltaX + lastPosX;
posY = ev.gesture.deltaY + lastPosY;
break;
case 'transform':
rotation = last_rotation + ev.gesture.rotation;
scale = Math.min(last_scale * ev.gesture.scale, 10);
break;
}
if(scale <= 0.5) alert("scale is less than or equal to 0.5");
if(scale > 1.0 ) alert("scale is bigger than 1.0");
var transform = "translate(" + 0 + "px," + 0 + "px) " + "scale(" + 0 + "," + scale + ")";
var style = element.style;
style.transform = transform;
style.oTransform = transform;
style.msTransform = transform;
style.mozTransform = transform;
style.webkitTransform = transform;
}