Модули: Scrollbar

WT JSwiper - SWiper.js для Joomla-разработчиков - Документация
Категория: Плагины Joomla

Свойства, методы и события модуля Scrollbar для Swiper.js.

Scrollbar

Полоса прокрутки слайдера Swiper.js.

 

Параметры Scrollbar

dragClass

Тип: string
Значение по умолчанию: swiper-scrollbar-drag
Описание

CSS класс перемещаемого элемента.

dragSize

Тип: number | 'auto'
Значение по умолчанию: auto
Описание

Размер перемещаемого элемента полосы прокрутки в пикселях.

draggable

Тип: boolean
Значение по умолчанию: false
Описание

Установите true, чтобы включить возможность перетаскивания полосы прокрутки. Это даст вам власть над судьбой ползунка и позволит влиять на его положение.

el

Тип: any
Значение по умолчанию: null
Описание

Строка с CSS-селектором или HTMLElement контейнера скролбара.

enabled

Тип: boolean
Значение по умолчанию: нет
Описание

Включена полоса прокрутки или нет. Логический флаг для использования скролбара на определённых разрешениях экрана (с определенными брейкпоинтами).

hide

Тип: boolean
Значение по умолчанию: true
Описание

Включена полоса прокрутки или нет. Логический флаг для использования скролбара на определённых разрешениях экрана (с определенными брейкпоинтами).

horizontalClass

Тип: string
Значение по умолчанию: swiper-scrollbar-horizontal
Описание

CSS класс полосы прокрутки слайдера в горизонтальной ориентации.

lockClass

Тип: string
Значение по умолчанию: swiper-scrollbar-lock
Описание

CSS класс, назначаемый полосе прокрутки слайдера в выключеном состоянии.

scrollbarDisabledClass

Тип: string
Значение по умолчанию: swiper-scrollbar-disabled
Описание

CSS класс, добавляемый к контейнеру Swiper и полосе прокрутки при отключении из-за не попадания в брейкпоинт (текущее разрешение экрана не попадает в указанный диапазон).

snapOnRelease

Тип: boolean
Значение по умолчанию: false
Описание

Установите true для прокрутки слайдера к ближайшему слайду после того, как вы отпустили скролбар.

verticalClass

Тип: string
Значение по умолчанию: swiper-scrollbar-vertical
Описание

CSS класс для полосы прокрутки слайдера в вертикальной ориентации.

Методы Scrollbar

Свойства

swiper.dragEl

Тип: HTMLElement[]
Описание

HTMLElement перетаскиваемого элемента скролбара.

swiper.el

Тип: HTMLElement[]
Описание

HTMLElement контейнера скролбара.

Методы

swiper.destroy()

Тип: нет
Описание

Уничтожение объекта скролбара

swiper.init()

Тип: нет
Описание

Инициализация скролбара

swiper.setTranslate()

Тип: нет
Описание

Обновляет переход скролбара.

swiper.updateSize()

Тип: нет
Описание

Обновление размеров пути скролбара и перемещаемого элемента.

События Scrollbar

scrollbarDragEnd

Аргумент: (swiper, event)
Описание

Событие вызывается в момент окончания перетаскивания скролбара.

scrollbarDragMove

Аргумент: (swiper, event)
Описание

Событие вызывается в процессе перетаскивания скролбара.

scrollbarDragStart

Аргумент: (swiper, event)
Описание

Событие вызывается в момент начала перетаскивания скролбара.

CSS-переменные Scrollbar Swiper.js

{
  --swiper-scrollbar-border-radius: 10px;
  --swiper-scrollbar-top: auto;
  --swiper-scrollbar-bottom: 4px;
  --swiper-scrollbar-left: auto;
  --swiper-scrollbar-right: 4px;
  --swiper-scrollbar-sides-offset: 1%;
  --swiper-scrollbar-bg-color: rgba(0, 0, 0, 0.1);
  --swiper-scrollbar-drag-bg-color: rgba(0, 0, 0, 0.5);
  --swiper-scrollbar-size: 4px;
}

Расширения Joomla WebTolk

96 Всего расширений
12 Категорий
482 Выпущено версий
539789 Всего скачиваний
Корзина
Корзина пуста