rotatey()
La fonction rotatey() définit une rotation, qui déplace l'élément autour de l'axe des ordonnées, sans le déformer. L'angle de rotation est défini par l'argument passé à la fonction. Si l'angle indiqué est positif, le mouvement sera appliqué dans le sens horaire et sinon il sera appliqué dans le sens inverse des aiguilles d'une montre.L'axe de la rotation passe par l'origine du repère, définie par la propriété transform-origin.
La notation rotatey(α) est une notation raccourcie, équivalente à rotate3d(0, 1, 0, α).
<style>
.fond {
width: 200px;
height: 200px;
margin-left: 20px;
border: 1px dotted black;
perspective: 800px;
}
.carre {
width: 200px;
height: 200px;
background-color: magenta;
}
.carre#rotat {
transform: rotatey(60deg);
}
</style>
<div class="fond">
<div class="carre"></div>
</div>
<br><br>
<div class="fond">
<div class="carre" id="rotat"></div>
</div>