ScrollbarOptions | Swiper - v12.0.1

带有滚动条参数的对象。

示例

const swiper = new Swiper('.swiper', {
  scrollbar: {
    el: '.swiper-scrollbar',
    draggable: true,
  },
});

层级

ScrollbarOptions

索引

属性

可选 dragClass

dragClass: string

滚动条可拖动元素的 CSS 类

默认值: 'swiper-scrollbar-drag'

可选 dragSize

dragSize: number | "auto"

滚动条可拖动元素的大小，单位为像素

默认值: 'auto'

可选 draggable

draggable: boolean

设置为 true 以启用滚动条拖动功能，允许您控制滑块位置

默认值: false

可选 el

el: any

带有滚动条容器的 CSS 选择器字符串或 HTML 元素。

默认值: null

可选 enabled

enabled: boolean

用于与断点一起使用的布尔属性，以在特定断点上启用/禁用滚动条

可选 hide

hide: boolean

用户交互后自动隐藏滚动条

默认值: true

可选 horizontalClass

horizontalClass: string

在水平 Swiper 中设置为滚动条的 CSS 类名

默认值: 'swiper-scrollbar-horizontal'

可选 lockClass

lockClass: string

滚动条元素禁用时附加的 CSS 类

默认值: 'swiper-scrollbar-lock'

可选 scrollbarDisabledClass

scrollbarDisabledClass: string

当滚动条被断点禁用时，添加到 swiper 容器和滚动条元素的 CSS 类名

默认值: 'swiper-scrollbar-disabled'

可选 snapOnRelease

snapOnRelease: boolean

设置为 true 以在释放滚动条时将滑块位置对齐到幻灯片

默认值: false

可选 verticalClass

verticalClass: string

在垂直 Swiper 中设置为滚动条的 CSS 类名

默认值: 'swiper-scrollbar-vertical'