Давно хотели добавить в ваш магазин изюминку? Тогда этот модуль просто находка для Вас!
На сегодняшний день Параллакс является неким трендом веб-сайтов. Параллакс - это эффект при котором фон или, в данном случае, изображение двигается с отличной от переднего плана скоростью при прокрутке страницы или по движению мыши. Будьте уверены, этот уникальный эффект впечатлит ваших посетителей.
Модуль "Параллакс баннеры" сочетает в себе 3 модуля:
- Он добавляет параллакс эффект по движению мыши. Это позволяет создать анимацию движения объекта или ощущение у пользователя 3D изображения.
- Добавляет асинхронное движение изображения баннера при скролле окна браузера, что выглядит достаточно необычно.
- Модуль имеет Full width wrapper, что позволяет растягивать любые баннеры, включая стандартный slider, на всю ширину окна браузера.
Модуль не изменяет файлы ядра CS-Cart, не переписывает шаблоны, поддерживает дальнейшие обновления. Поэтому при использовании нашего модуля у вас не возникнет проблем с совместимостью. Также, модуль полностью поддерживается сенсорными устройствами. А Множество настроек позволит вам тонко сконфигурировать итоговое поведения Параллакс эффекта.
Совместимость:
Данный модуль корректно работает в Internet Explorer 9+, Mozilla Firefox, Safari, Google Chrome и Opera (последние версии).
Модуль совместим с CS-Cart и Multi-Vendor версии 4.3.7 - 4.12.2
Замечания:
- Одна лицензия модуля действительна только для одной CS-Cart установки. Для того, чтобы использовать модуль на другой CS-Cart установке, необходимо приобрести еще одну лицензию.
- Мы не отправляем исходный код модуля. После приобретения Вы получаете начальный пакет, который требует активации для получения полного функционала модуля. Инструкция по установке и активации находится в архиве с начальным пакетом.
- Вы понимаете и соглашаетесь, что в случае возникновения трудностей в работе модуля, Вы готовы предоставить временный FTP доступ к Вашему магазину для того, чтобы мы могли изучить и исправить проблему.
Есть идеи по улучшению данного модуля? Поделитесь с нами.
- Загрузите архив со страницы вашего заказа и распакуйте его во временную папку.
- Загрузите установочный пакет на странице Модули -> Управление модулями и вставьте лицензионный ключ.
- После этих действий модуль станет активным и загрузит исполняемые файлы с нашего сервера, совместимые с вашей версией CS-Cart.
Как сделать баннер на всю ширину
- Необходимо выбрать у блока баннера оболочку 'Full width'.
Как добавить баннеры с эффектом Parallax scroll
- Загрузить необходимые баннеры в Marketing -> Banners
- Перейти в Design -> Layouts
- Добавить в необходимую секцию блок "Баннеры".
- Выбрать шаблон "Parallax" для этого блока. Кликнуть на Настройки рядом с выпадающим меню выбора шаблона.
- В появившихся настройках выбрать "Scroll" в настройке "Detect". Изменить другие настройки при необходимости.
- На вкладке Content выбрать загруженные баннеры из #1.
Как добавить баннеры с эффектом Parallax mousemove
- Загрузить необходимые баннеры в Marketing -> Banners
- Перейти в Design -> Layouts
- Добавить в необходимую секцию блок "Баннеры".
Как изменить направление движения слоя в Parallax mousemove banner или изменить скорость или остановить движение определенного слоя
- . Зайти на страницу редактирования необходимого баннера (слоя) в Marketing -> Banners.
- Для изменения скорости движения слоя необходимо изменить значение настройки 'Parallax layer sensetivity, %'.
- Для изменения направления движения необходимо указать negative value в настройке 'Parallax layer sensetivity, %', например '-100'.
- Для остановки движения слоя необходимо указать zero value в настройке 'Parallax layer sensetivity, %'.
Почти все настройки для создания эффекта Параллакса находятся в настройках шаблона 'Parallax' блока типа 'Banners':
Sensitivity axis X - коэффициент, который изменяет дистанцию движения по оси X в зависимости от движения мыши.
Sensitivity axis Y - коэффициент, который изменяет дистанцию движения по оси Y в зависимости от движения мыши или при прокрутке.
Scope: Item - Parallax mousemove будет реагировать только на движение мыши поверх баннера.
Scope: Global - Parallax mousemove будет реагировать на движение мыши по всему окну браузера.
Fit layers to container width – - Если слои больше размеров сетки/контейнера блока Параллакс, то слои-изображения будут отмасштабированны, чтобы уместиться полностью.
Detect – основная настройка, которая отвечает за действие, на которое будет реагировать Параллакс.
Link – Баннеры должны вызывать желание клика у пользователя, чтобы привести на целевую страницу. Вы можете использовать прямую ссылку или задать dispatch значение .
Coefficient for reducing scroll banner's height - Полезно для баннера с эффектом Parallax scroll. Уменьшает высоту контейнера, чтобы пользователь не увидел край баннера при прокрутке.