translateX-funksie
Die funksie translateX stel die verskuiwing van 'n element
op die X-as in. Dit word saam met die eienskap
transform gebruik.
Die waarde van die eienskap kan enige eenhede
vir grootte wees. 'n Positiewe waarde skuif dit
na regs, 'n negatiewe waarde na links.
Sintaksis
selekteerder {
transform: translateX(verskuiwing);
}
Voorbeeld
As jy met die muis oor die blok beweeg - sal dit verskuif
met 30px na regs:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateX(30px);
}
:
Voorbeeld
As jy met die muis oor die blok beweeg - sal dit verskuif
met 30px na links:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateX(-30px);
}
:
Sien ook
-
die funksie
translate,
wat verskuiwing op die X- en Y-asse instel -
die funksie
translateY,
wat verskuiwing op die Y-as instel
