• Теория
  • Теория

Кекстаграм: ползунок-разделитель

Теперь нам нужен специальный ползунок-разделитель на границе двух фотографий.

С помощью этого ползунка мы будем изменять ширину фотографии-оригинала, чтобы сравнивать разные части изображений.

Ползунок мы разместим в том же блоке, что и фотографии, спозиционируем его абсолютно и зададим координаты таким образом, чтобы с помощью JavaScript было удобно его перемещать.

По умолчанию ползунок будет находиться в центре блока с фото. Для центровки мы применим приём с трансформацией перемещения, рассмотренный в части «Двумерные трансформации».

Минимальный вид табов
  • index.html
HTML
HTML

Вы перешли на другую страницу

Кликните внутри мини-браузера, чтобы поставить фокус в это окно.

100%
Бабушка Кекс

Притормози, дружище

Проходить вызовы части «Кекстаграм: Эпилог. JavaScript» тренажёра «Практика: фотоприложение с фильтрами» можно после регистрации и оформления подписки.