2012-09-10 9 views
5

Sto utilizzando il plug-in jQuery touchy per rilevare l'evento di pizzicamento per offrire agli utenti la possibilità di ingrandire/ridurre un'immagine. Ecco l'essenza del mio codice:ridimensionamento dell'immagine sul gesto di pizzico

 
var w = 800, 
    h = 600; 
$('img').on('touchy-pinch', function (e, $target, data) { 
    $(this).css({ 
     width: w * data.scale, 
     height: h * data.scale 
    }); 
}); 

Dove l'oggetto di dati personalizzato contiene quanto segue:

  • scala
  • previousScale
  • currentPoint
  • startPoint
  • startDistance

Funziona bene sul primo pizzico, ma quando le mie dita escono dallo schermo e poi provo a rifarlo, l'immagine si ridimensiona. Come posso modificare il mio gestore in modo che l'immagine continui nel punto in cui era stata interrotta anziché ridimensionarla? L'utilizzo del precedenteScale dei dati non ha aiutato dal momento che anche il precedenteScale viene ripristinato.

risposta

4

Il problema qui è che non stai reimpostando i tuoi wars con i loro valori post-ridimensionati, solo i css, quindi lo stile ritorna a 800x600 su un altro evento di scala. È necessario un w and h persistente impostato su w*data.scale e h*data.scale sull'evento di scala.

Problemi correlati