rotateY функциясы
rotateY функциясы үшөлшемді кеңістікте
Y осі бойынша бұрылысты орнатады. transform
сипатымен бірге қолданылады. Сипаттың мәні ретінде
бұрыш
бірліктеріндегі кез келген бұрыш қолданылады.
Оң мән бізге қарай, теріс мән бізден қарама-қарсы
бағытта бұрады. Бұрылыс transform-origin
сипаты арқылы орнатылатын нүкте айналасында жүзеге асады.
Синтаксис
селектор {
transform: rotateY(бұрыш);
}
Мысал
Бұл мысалда блок үстіне курсор қойған кезде Y осі
бойынша 180 градусқа бұрылады. Бұрылыстың
жұмсақтығы үшін 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);
}
:
