Funksie rotate3d

Die funksie rotate3d stel die rotasie van 'n element op 'n gegewe hoek gelyktydig om die X-, Y-, Z-as in driedimensionele ruimte. Word gebruik saam met die eienskap transform. Die waarde van die eienskap is die hoek in enige eenhede vir hoeke.

As waardes neem die funksie 4 parameters, geskryf met kommas. Die eerste drie parameters bepaal die vektor-as in driedimensionele ruimte, relatief tot die een waarop die rotasie sal plaasvind. Die vierde parameter stel die rotasiehoek.

Sintaksis

cssselektor {
  transform: rotate3d(X, Y, Z, hoek);
}

Voorbeeld

In hierdie voorbeeld sal die vektor-as gerig wees na die regter boonste hoek van die skerm:

html<div id="elem">lorem ipsum</div>

css#elem {
  border: 3px solid black;
  width: 100px;
  height: 50px;
  transition: transform 3s linear;
}
#elem:hover {
  transform: rotate3d(1, 1, 0, 180deg);
}

Результат:

Kyk ook na