Foundation - 滑块 JavaScript 参考

描述

Foundation 提供用于滑块的 JavaScript 组件。

除了 foundation.core.js 插件之外，您还需要在 JavaScript 中包含 foundation.slider.js 才能使用此插件。此插件需要以下列出的实用程序库。

它用于创建下拉菜单的新实例。

var elem = new Foundation.Slider(element);

下表列出了 Foundation.slider 使用的参数。

序号	名称和描述	类型
1	element jQuery 对象用于转换为手风琴菜单。	jQuery
2	options 覆盖插件的默认设置。	对象

序号

名称和描述

类型

element

jQuery 对象用于转换为手风琴菜单。

jQuery

options

覆盖插件的默认设置。

对象

要自定义滑块实例，可以使用插件选项。这些选项可以设置为传递给插件构造函数的对象、单个数据属性或一个组合的 data-options 属性。下表显示了如何初始化 JavaScript 插件。

序号	名称和描述	示例
1	start 滑块刻度的最小值。	0
2	end 滑块刻度的最大值。	100
3	step 它表示每次更改事件的最小值变化。目前未实现。
4	initialStart 初始化时必须将左侧手柄/第一个输入设置为的值。	0
5	initialEnd 初始化时必须将右侧手柄/第二个输入设置为的值。	100
6	binding 它允许将输入放置在容器外部并可见。	false
7	clickSelect 它允许您单击或点击滑块栏以选择一个值。	true
8	vertical 设置为 true 并使用 vertical 类时，允许您将对齐方式更改为垂直方向。	false
9	draggable 允许您拖动滑块手柄以选择一个值。	true
10	disabled 阻止应用事件侦听器并禁用滑块。由 JS 与 'disabledClass' 交叉检查。	false
11	doubleSided 它允许使用两个手柄，并由 JS 交叉检查。	false
12	decimal 表示插件对于浮点精度必须执行的小数位数。	2
13	moveTime 当用户单击栏时，它是动画滑块手柄移动的时间。如果在 Sass 设置中更新过渡时间，则需要手动设置。	200
14	disabledClass 用于禁用滑块	'disabled'

这些事件从任何带有附加滑块插件的元素触发。当手柄移动完成时，会触发 moved.zf.slider。

.destroy 用于销毁滑块插件。

foundation_basic_controls.htm

打印页面