rotate funksiýasy
rotate() funksiýasy elementi bellenen burça
öwürýär. transform
hasiýeti bilen bilelikde ulanylýar. Hasiýetiň bahasy
burç ülçeg birliklerindäki
istýän bir burçdyr. Positive baha sagat ýelpygy boýunça,
negative bolsa sagat ýelpygyna garşy öwürýär. Öwrüliş
transform-origin
hasiýeti bilen bellenen nokat daşyndan amala aşyrylýar.
Sintaksis
selektor {
transform: rotate(burç);
}
Mysal
Bu mysalda blok sagat ýelpygy boýunça 30
gradusa öwrüldi:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Mysal
Bu mysalda blok sagat ýelpygyna garşy 30
gradusa öwrüldi:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Mysal
Bu mysalda blok gelinende 1 aýlaw öwrüler,
sebäbi öwrüliş bahasy 1turn bellenen (şonuň ýaly
täsiri 360deg burç bilen bellenende hem
alynar). Öwrülişiň üznüksizligi üçin
transition
hasiýeti goşuldy:
<div id="elem">lorem ipsum</div>
#elem {
border: 3px solid black;
width: 100px;
height: 50px;
transition: transform 3s linear;
}
#elem:hover {
transform: rotate(1turn);
}
:
