Funkce scaleX

Funkce scaleX škáluje prvek podél osy X. Škálování se provádí kolem bodu určeného vlastností transform-origin. Hodnotou funkce je celé nebo desetinné číslo. Pokud je větší než 1 - prvek se zvětší, pokud je menší (například 0.5) - prvek se zmenší. Pokud zadáte 1 - nic se nezmění (toto je výchozí hodnota).

Syntaxe

cssselektor {
  transform: scaleX(číslo);
}

Příklad

Při najetí myši na blok zvětšíme měřítko 1.5 krát podél osy X:

html<div id="elem">lorem ipsum</div>
css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scaleX(1.5);
}

Результат:

Příklad

Při najetí myši na blok zmenšíme měřítko 2 krát podél osy X:

html<div id="elem">lorem ipsum</div>
css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scaleX(0.5);
}

Результат:

Viz také

  • funkci scale,
    která nastavuje škálování podél os X a Y
  • funkci scaleY,
    která nastavuje škálování podél osy Y