Функция translateY

Функцията translateY задава преместване на елемент по оста Y. Използва се заедно със свойството transform. Стойността на свойството са всякакви единици за размер. Положителна стойност премества надолу, отрицателна - нагоре.

Синтаксис

селектор {
	transform: translateY(отместване);
}

Пример

Ако поставите мишката върху блока - той ще се премести с 30px надолу:

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

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

Пример

Ако поставите мишката върху блока - той ще се премести с 30px нагоре:

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

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

Вижте също

функцията translate,
която задава преместване по осите X и Y
функцията translateX,
която задава преместване по оста X