translateY()

La fonction translateY() permet de déplacer un élement verticalement sur le plan. Cette transformation est caractérisée par une longueur (type <length>) qui définit l'amplitude du déplacement.

translateY(ty) est une notation raccourcie équivalente à translate(0, ty).

Syntaxe

translateY(t)

Valeurs

t
Une valeur de type <length> qui représente l'ordonnée du vecteur de translation (la composante en Y).
Coordonnées cartésiennes sur ℝ2 Coordonnées homogènes sur ℝℙ2 Coordonnées cartésiennes sur ℝ3 Coordonnées homogènes sur ℝℙ3

Une translation n'est pas une transformation linéaire sur ℝ2 et on ne peut donc pas la représenter en utilisant une matrice exprimée dans le système cartésien.

10001t001 10001t001 1000010t00100001
[1 0 0 1 0 t]

Exemples

HTML

<p>toto</p>
<p class="transformation">truc</p>
<p>toto</p>

CSS

p { 
  width: 50px;
  height: 50px;
  background-color: teal;
}

.transformation {
  transform: translateY(10px);
  background-color: blue;
}

Résultat

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : SphinxKnight, mrstork
 Dernière mise à jour par : SphinxKnight,