Funkcia translateX
Funkcia translateX nastavuje posun prvku
pozdĺž osi X. Používa sa spolu s vlastnosťou
transform.
Hodnotou vlastnosti sú ľubovoľné jednotky
pre veľkosť. Kladná hodnota posúva
doprava, záporná - doľava.
Syntax
selektor {
transform: translateX(posun);
}
Príklad
Ak na blok nasmerujete myš - posunie sa
o 30px doprava:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateX(30px);
}
:
Príklad
Ak na blok nasmerujete myš - posunie sa
o 30px doľava:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateX(-30px);
}
:
Pozrite tiež
-
funkciu
translate,
ktorá nastavuje posun pozdĺž osí X a Y -
funkciu
translateY,
ktorá nastavuje posun pozdĺž osi Y