Fonction scaleY

La fonction scaleY met à l'échelle un élément selon l'axe Y. La mise à l'échelle est effectuée autour du point défini par la propriété transform-origin. La valeur de la fonction est un nombre entier ou décimal. S'il est supérieur à 1 - l'élément est agrandi, s'il est inférieur (par exemple, 0.5) - l'élément est réduit. Si vous définissez 1 - rien ne change (c'est la valeur par défaut).

Syntaxe

csssélecteur {
  transform: scaleY(nombre);
}

Exemple

Au survol du bloc, augmentons l'échelle de 1.5 fois selon l'axe Y :

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

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

Результат:

Exemple

Au survol du bloc, réduisons l'échelle de 2 fois selon l'axe Y :

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

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

Результат:

Voir aussi