Функсияи rotateY

Функсияи rotateY гардондани элементро нисбат ба меҳвари Y дар фазои сеандоза таъин мекунад. Бо хосияти transform кор мекунад. Қимати он кунҷест дар ягон воҳиди кунҷӣ. Қимати мусбат ба сӯи мо, манфӣ - аз мо мегардонад. Гардондани элемент атрофи нуқтае сурат мегирад, ки аз тарафи хосияти transform-origin муайян карда мешавад.

Синтаксис

интихобкунанда {
	transform: rotateY(кунҷ);
}

Намуна

Дар ин намуна блок бо гардиши курсор 180 дараҷа атрофи меҳвари Y мегардад. Барои ба таври мулоим гардидани он хосияти transition илова шудааст:

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

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

Намуна

Меҳвари гардишро бо ёрии хосияти transform-origin иваз мекунем:

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

#elem {
	border: 3px solid black;
	width: 100px;
	height: 50px;
	transition: transform 3s linear;
	transform-origin: right center;
}
#elem:hover {
	transform: rotateY(180deg);
}

Ҳамчунин нигаред

функсияи rotate,
ки гардондани элементро нисбат ба меҳварҳои X ва Y таъин мекунад
функсияи rotateX,
ки гардондани элементро нисбат ба меҳвари X таъин мекунад
функсияи rotateZ,
ки гардондани элементро нисбат ба меҳвари Z таъин мекунад
функсияи rotate3d,
ки гардондани элементро нисбат ба се меҳвар таъин мекунад