Funktion rotate3d
Die Funktion rotate3d bewirkt eine Drehung des Elements
um einen bestimmten Winkel gleichzeitig relativ zur
X-, Y- und Z-Achse im dreidimensionalen Raum. Sie wird
zusammen mit der Eigenschaft transform verwendet.
Als Wert der Eigenschaft dient ein Winkel in beliebigen Winkeleinheiten.
Die Funktion akzeptiert 4
Parameter, durch Kommas getrennt. Die ersten
drei Parameter definieren den Achsenvektor im dreidimensionalen
Raum, relativ zu dem die Drehung
durchgeführt wird. Der vierte Parameter
legt den Drehwinkel fest.
Syntax
Selektor {
transform: rotate3d(X, Y, Z, Winkel);
}
Beispiel
In diesem Beispiel zeigt der Achsenvektor in die obere rechte Ecke des Bildschirms:
<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);
}
:
