TranslateX funktsiyasi
translateX funktsiyasi elementni X o‘qi
bo‘yicha siljitadi. transform
xususiyati bilan birgalikda ishlatiladi.
Qiymati sifatida o‘lcham birliklarining
istalgan turi ishlatilishi mumkin. Musbat qiymat
o‘ngga, manfiy qiymat chapga siljitadi.
Sintaksis
selector {
transform: translateX(siljish);
}
Misol
Agar blokka sichqonchani olib borsangiz - u
30px o‘ngga siljiydi:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateX(30px);
}
:
Misol
Agar blokka sichqonchani olib borsangiz - u
30px chapga siljiydi:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateX(-30px);
}
:
Shuningdek
-
translatefunktsiyasi,
bu X va Y o‘qlari bo‘yicha siljitishni belgilaydi -
translateYfunktsiyasi,
bu Y o‘qi bo‘yicha siljitishni belgilaydi