Сравнение изображений До/После

Новинка

Характеристики

Подходящие редакции

—

Первый сайт, Старт, Стандарт, Малый бизнес, Бизнес, Интернет-магазин + CRM, Корпоративный портал, Энтерпрайз

Адаптивность

—

Да

Поддержка Композита

—

Да

Установлено

—

Менее 50 раз

Дата публикации

—

09.02.2026

Версия

—

1.0.0

Все характеристики

On-Line Demo

Опубликовано:: 09.02.2026
Обновлено:
Версия:: 1.0.0
Установлено:: Менее 50 раз
Подходящие редакции:: Первый сайт, Старт, Стандарт, Малый бизнес, Бизнес, Интернет-магазин + CRM, Корпоративный портал, Энтерпрайз
Адаптивность:: Да
Поддержка Композита:: Да
Совместимо с Сайты24: Нет
Совместимо с PHP 8.1

Готовое решение для 1С-Битрикс, позволяющее разместить на сайте интерактивные блоки сравнения двух изображений (“Before/After”). Решение подходит для демонстрации результатов работы и наглядных изменений: ремонт и интерьер, авто, бьюти-услуги, ретушь, медицина, клининг, производство и др.

Основные возможности

Интерактивное сравнение “До/После” с управлением ползунком
Два режима отображения:
- Overlay (перетаскивание по изображению)
- Bar (ползунок под изображением)
Вывод нескольких наборов сравнения с переключением через иконки-табы
Вывод одного набора сравнения в ручном режиме (без инфоблока)
Настраиваемые элементы интерфейса:
- заголовок блока
- подпись (label)
- бейджи “До/После” и их тексты
- логотип в элементе управления
- позиция, размер и отступы иконок вкладок
- адаптивное поведение на мобильных устройствах
Ресайз изображений по пресетам или произвольно, управление качеством WebP (при наличии поддержки на сервере)

Способы использования

Компонент из инфоблока — для портфолио/галереи “До/После”, когда нужно выводить множество примеров и переключаться между ними.
Компонент ручного набора — для лендингов и страниц услуг, где нужен один конкретный пример сравнения.

Преимущества внедрения

Наглядная демонстрация результата повышает вовлечённость и доверие
Гибкая настройка внешнего вида и поведения
Возможность централизованно управлять настройками и при необходимости переопределять их на уровне конкретной страницы