Funktionen rotate3d
Funktionen rotate3d sätter rotation av ett element
på en given vinkel samtidigt relativt
X-, Y- och Z-axlarna i tredimensionellt utrymme. Används
tillsammans med egenskapen transform.
Värdet på egenskapen är en vinkel i någon enhet
för vinklar.
Som värden tar funktionen 4
parametrar, skrivna med kommatecken. De första
tre parametrarna bestämmer axelvektorn i tredimensionellt
utrymme, relativt vilken rotationen
kommer att utföras. Den fjärde parametern
sätter rotationsvinkeln.
Syntax
selektor {
transform: rotate3d(X, Y, Z, vinkel);
}
Exempel
I detta exempel kommer axelvektorn att riktas till det övre högra hörnet av skärmen:
<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);
}
:
