Notice: Function _load_textdomain_just_in_time was called incorrectly. Translation loading for the basekit domain was triggered too early. This is usually an indicator for some code in the plugin or theme running too early. Translations should be loaded at the init action or later. Please see Debugging in WordPress for more information. (This message was added in version 6.7.0.) in /var/www/vhosts/trex3.themerex.net/httpdocs/wp-includes/functions.php on line 6121
Background slideshow – BaseKit
Skip to content Skip to footer
Open Hours:Mn - St, 8:00 a.m. - 9:00 p.m.
123, New Lenox, Chicago
Work Time8:00 - 18:00
Shopping Cart 0 items - $0.00 0
123, New Lenox, Chicago, IL 60606
Shopping Cart 0 items - $0.00 0

Background slideshow

Background slideshow

Elementor's sections

Background slideshow

Начиная с версии 1.96.0 в движок добавлен модуль “Background slideshow”, позволяющий для строк Элементора добавлять неограниченное количество картинок, которые образуют слайдшоу на фоне строки. Используется комбинация эффектов “Pan” (панорамирование, медленный зум) и “KenBurn” (проявление одной картинки сквозь другую).

В отличие от стандартного “Background – Slideshow” от Элементора, в нашем модуле используется easing, а также можно задавать вид анимации, ее направление и менять точку приложения эффекта для каждой картинки отдельно, что позволяет создавать более динамичные и разнообразные смены картинок.

Параметр “Overlay color” добавляет цветной слой с прозрачностью, который тонирует создаваемое слайдшоу.

Параметр “Animation duration” регулирует длительность перехода между слайдами (для всех слайдов одинаковая). 

В блоке “Images” можно добавлять неограниченное количество слайдов (изображений), для каждого из которых выбирается:

  • Slide size” – размер слайда:
    – cover
    – contain
    – fill
  • Slide effect” – эффект появления:
    – none – статический слайд (без эффекта появления)
    – fade – смена статических слайдов эффектом “Fade”
    – zoom in – увеличение
    – zoom out – уменьшение
    – infinite in – поочередное бесконечное увеличение / уменьшение (применяется для одиночных слайдов, т.к. не происходит переход к следующему слайду)
    – infinite out – поочередное бесконечное уменьшение / увеличение (применяется для одиночных слайдов, т.к. не происходит переход к следующему слайду)
  • Slide origin” – точка приложения эффекта:
    – top left | center | right
    – middle left | center | right
    – bottom left | center | right

Ниже приведен пример секции с фоновым слайдшоу.

Настройки секции
Background slides

Section with a background slideshow

Модуль "Background slideshow" позволяет для строк Элементора добавлять неограниченное количество картинок, которые образуют слайдшоу на фоне строки. Используется комбинация эффектов "Pan" (панорамирование, медленный зум) и "KenBurn" (проявление одной картинки сквозь другую). Можно управлять длительностью анимации, а также задавать вид анимации и ее направление для каждой картинки отдельно

Elementor's sections

Background mask

Начиная с версии 2.11.0 в модуль “Background slideshow” добавлена группа параметров “Background mask”, благодаря которым можно накладывать SVG-изображение с прозрачными областями, сквозь которые будет видно фоновое изображение секции или слайдшоу. Непрозрачную часть маски можно “тонировать” любым (в том числе полупрозрачным) цветом. Если высота секции больше высоты окна – слайдшоу принимает размер окна и при скролле фиксируется, создавая таким образом неподвижный фон. При этом маска по мере скролла увеличивается в размерах, чтобы заполнить все окно.

Маска может использоваться как для слайдшоу, так и для стандартного фона секции (заданного в “родных” настройках “Background” самого Элементора).

Предусмотрено поле для загрузки кастомной маски (файл формата SVG, в котором все элементы маски обернуты в группу с классом “trx_addons_mask_in_svg” – нужен для масштабирования маски при скролле).

Также в аддон “Background slideshow” добавлен эффект смены слайдов “Fade” и изменено стандартное поведение при не выбранном эффекте (эффект равен “none”) – смена слайдов происходит не по таймеру, а при скролле окна.

  • Параметр “Allow mask” включает/отключает применение маски для данной секции. По умолчанию маска не применяется.
  • В поле “Mask image” можно загрузить альтернативную маску (SVG-файл, в котором нарисован сплошной путь с “отверстиями” нужной формы, сквозь которые будет проглядывать фоновое изображение). Если нужна поддержка масштабирования макси при скролле, то все объекты в этом файле должны быть сгруппированы в группу с классом “trx_addons_mask_in_svg”
  • Параметр “Mask color” задает цвет тонирования сплошной части маски (может быть с прозрачностью).
  • Параметр “Mask delay” задает отставание маски при ее следовании за курсором мыши. Чем больше число – тем больше отставание. При значениях 0 и 1 маска следует за мышью без задержки.
  • Параметр “Mask zoom” задает начальный масштаб маски. В виду техники реализации маски это число не может быть меньше 1, поэтому при создании кастомной маски нужно рисовать ее сразу не больше нужного размера (лучше даже немного меньше), а при необходимости увеличивать этим полем

Ниже приведены примеры секции с фоновым слайдшоу и маской и со стандартным фоном секции и маской.

Настройки секции

Background slideshow with a mask

Find a Cat

E-mail
Password
Confirm Password