Funktionen translateY
Funktionen translateY anger förskjutning av element
längs Y-axeln. Används tillsammans med egenskapen
transform.
Värdet på egenskapen är alla enheter
för storlek. Positivt värde förskjuter
nedåt, negativt - uppåt.
Syntax
selector {
transform: translateY(förskjutning);
}
Exempel
Om du håller musen över blocket - kommer det att förskjutas
30px nedåt:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateY(30px);
}
:
Exempel
Om du håller musen över blocket - kommer det att förskjutas
30px uppåt:
<div id="elem"></div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: translateY(-30px);
}
:
Se även
-
funktionen
translate,
som anger förskjutning längs X- och Y-axlarna -
funktionen
translateX,
som anger förskjutning längs X-axeln