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

В этом решении не используются скрипты и оно является адаптивным.

Поместим одно и тоже изображение в разные контейнеры:

и добавим стили:

Немного о том, как что работает:

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

В итоге получилось это:

Еще один вариант оформления:

И стиль для него:

Добавить комментарий

Ваш комментарий отправлен!

Комментарии: