Funktsioon translateX
Funktsioon translateX määrab elemendi nihutamise
piki X-telge. Kasutatakse koos omadusega
transform.
Omaduse väärtuseks on mis tahes suuruse
ühikud. Positiivne väärtus nihutab
paremale, negatiivne - vasakule.
Süntaks
selektor {
transform: translateX(nihke);
}
Näide
Kui hiirega bloki peale minna - see nihkub
30px võrra paremale:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateX(30px);
}
:
Näide
Kui hiirega bloki peale minna - see nihkub
30px võrra vasakule:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateX(-30px);
}
:
Vaata ka
-
funktsiooni
translate,
mis määrab nihke piki X- ja Y-telge -
funktsiooni
translateY,
mis määrab nihke piki Y-telge