TranslateX funksiýasy

translateX funksiýasy elementi X oky boýunça süýşürýär. Ol transform hassa bilen bilelikde ulanylýar. Hassanyň bahasy hökmünde islendik ölçeg birligi ulanylyp bilner. Pozitiw baha saga süýşürýär, negatiw baha bolsa çepa.

Sintaksis

cssselektor {
  transform: translateX(süýşüriş);
}

Mysal

Eger bloka syçan kursoryny getirsemiz - ol saga 30px süýşer:

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

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

Результат:

Mysal

Eger bloka syçan kursoryny getirsemiz - ol çepa 30px süýşer:

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

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

Результат:

Şeýle-de görmeli