Funksjonen translateX
Funksjonen translateX setter forskyvning av elementet
langs X-aksen. Brukes sammen med egenskapen
transform.
Verdien til egenskapen er alle enheter
for størrelse. Positiv verdi forskyver
til høyre, negativ - til venstre.
Syntaks
velger {
transform: translateX(forskyvning);
}
Eksempel
Hvis du holder musepekeren over blokken - vil den forskyves
30px til høyre:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateX(30px);
}
:
Eksempel
Hvis du holder musepekeren over blokken - vil den forskyves
30px til venstre:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateX(-30px);
}
:
Se også
-
funksjonen
translate,
som setter forskyvning langs X- og Y-aksene -
funksjonen
translateY,
som setter forskyvning langs Y-aksen