scaleX funktsiyasi

scaleX funktsiyasi elementni X o‘qi bo‘yicha masshtablaydi. Masshtablash transform-origin xususiyati bilan belgilanadigan nuqta atrofida amalga oshiriladi. Funktsiya qiymati butun yoki kasr son hisoblanadi. Agar u 1 dan katta bo‘lsa - element kattalashadi, agar kichik bo‘lsa (masalan, 0.5) - element kichrayadi. Agar 1 belgilansa - hech narsa o‘zgarmaydi (bu standart qiymat hisoblanadi).

Sintaksis

cssselector {
  transform: scaleX(son);
}

Misol

Blokka sichqoncha olib borilganda, masshtabni X o‘qi bo‘yicha 1.5 marta oshiramiz:

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

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

Результат:

Misol

Blokka sichqoncha olib borilganda, masshtabni X o‘qi bo‘yicha 2 marta kamaytiramiz:

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

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

Результат:

Shuningdek qarang