тк 3 июля праздник (в беларуси), буду не онлайн (по возможности буду отвечать)

Функция 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