Fungsi translateY
Fungsi translateY mengatur pergeseran elemen
pada sumbu Y. Digunakan bersama dengan properti
transform.
Nilai propertinya adalah satuan ukuran apa pun.
Nilai positif menggeser ke bawah, nilai negatif - ke atas.
Sintaks
selektor {
transform: translateY(pergeseran);
}
Contoh
Jika mouse diarahkan ke blok - blok akan bergeser
sebesar 30px ke bawah:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateY(30px);
}
:
Contoh
Jika mouse diarahkan ke blok - blok akan bergeser
sebesar 30px ke atas:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateY(-30px);
}
:
Lihat juga
-
fungsi
translate,
yang mengatur pergeseran pada sumbu X dan Y -
fungsi
translateX,
yang mengatur pergeseran pada sumbu X