Funksjonen translateY

Funksjonen translateY setter forskyvning av elementet langs Y-aksen. Brukes sammen med egenskapen transform. Verdien til egenskapen er alle enheter for størrelse. Positiv verdi forskyver nedover, negativ - oppover.

Syntaks

cssvelger {
  transform: translateY(forskyvning);
}

Eksempel

Hvis du holder musepekeren over blokken - vil den forskyves 30px nedover:

html<div id="elem"></div>

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: translateY(30px);
}

Результат:

Eksempel

Hvis du holder musepekeren over blokken - vil den forskyves 30px oppover:

html<div id="elem"></div>

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: translateY(-30px);
}

Результат:

Se også