Nell’ultima versione di jQuery il modulo CSS è stato totalmente riscritto prestando la massima attenzione all’estensibilità, frutto di questo miglioramento è il plugin jQuery Rotate, che consente di ruotare elementi della pagina di un determinato angolo.
Abbiamo implementato una piccola demo visibile all’indirizzo:
http://demo.studio-88.it/jQuery143/
Bisogna solamente fare un po’ di attenzione alle untità di misura che in firefox sono espresse in radianti, non ho controllato su altri browser, ma su qualcono potrebbero essere espresse in gradi visti i valori di 180 e 90 dell’esempio.
In pratica sfruttando il plugin e le nuove caratteristiche del modulo css possiamo scrivere codice del genere:
$('#myDiv').css('rotate', 90);
$('#myDiv').animate({rotate: 180});
Ho fatto una prova anche su Safari per Win e anche lui se non esplicitamente scritto interpreta il valore passato come un valore in radianti.
Explorer 8 non si capisce neanche che fa!
In ogni caso c’è la soluzione, basta scrivere:
$('#demo').animate({rotate: '40deg'})