Funzione rotate3d
La funzione rotate3d imposta la rotazione di un elemento
di un angolo specificato simultaneamente rispetto
agli assi X, Y, Z nello spazio tridimensionale. Viene utilizzata
insieme alla proprietà transform.
Il valore della proprietà è un angolo in qualsiasi unità
per angoli.
La funzione accetta 4
parametri, scritti separati da virgole. I primi
tre parametri determinano il vettore dell'asse nello spazio
tridimensionale, rispetto al quale verrà
effettuata la rotazione. Il quarto parametro
imposta l'angolo di rotazione.
Sintassi
selettore {
transform: rotate3d(X, Y, Z, angolo);
}
Esempio
In questo esempio il vettore dell'asse sarà diretto nell'angolo in alto a destra dello schermo:
<div id="elem">lorem ipsum</div>
#elem {
border: 3px solid black;
width: 100px;
height: 50px;
transition: transform 3s linear;
}
#elem:hover {
transform: rotate3d(1, 1, 0, 180deg);
}
: