Жидкое Стекло

Этот текстовый блок добавлен специально для демонстрации эффекта искажения. Переместите "жидкую линзу" сюда, чтобы увидеть, как она влияет не только на фоновое изображение, но и на контент страницы.

В основе этого эффекта лежит SVG-фильтр `feDisplacementMap`. Он берет пиксели из исходного изображения (в данном случае, всего, что находится под линзой) и смещает их в соответствии с картой смещения. Карта смещения — это невидимое изображение, где красный канал определяет смещение по горизонтали, а зеленый — по вертикали.

Таким образом, создается иллюзия преломления света, как будто мы смотрим через объемный стеклянный или водный объект. Этот метод очень производительный и позволяет создавать сложные визуальные эффекты прямо в браузере с помощью CSS и SVG.

Эффект "Жидкое Стекло"

Объект летает сам по себе. Нажмите и удерживайте кнопку мыши, чтобы управлять им. Отпустите, чтобы он снова полетел сам.