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);
}
:
