Foundation-slider-javascript-reference
Foundation-Slider JavaScriptリファレンス
説明
Foundationは、スライダー用のJavaScriptコンポーネントを提供します。
初期化中
_foundation.core.js_プラグインと共に、このプラグインを使用するには、_foundation.slider.js_をJavaScriptに含める必要があります。 このプラグインには、次のリストされたユーティリティライブラリが必要です。
- foundation.util.motion.js
- foundation.util.triggers.js
- foundation.util.keyboard.js
- foundation.util.touch.js
Foundation.Slider
ドリルダウンメニューの新しいインスタンスを作成するために使用されます。
次の表に、_Foundation.slider_で使用されるパラメーターを示します。
Sr.No. | Name & Description | Type |
---|---|---|
1 |
element jQueryオブジェクトは、アコーディオンメニューを作成するために使用されます。 |
jQuery |
2 |
options プラグインのデフォルト設定をオーバーライドします。 |
Object |
プラグインオプション
スライダーインスタンスをカスタマイズするには、プラグインオプションを使用できます。 これらのオプションは、プラグインのコンストラクターに渡されるオブジェクト、個々のデータ属性、または1つの結合された_data-options_属性として設定できます。 次の表は、JavaScriptプラグインを初期化する方法を示しています。
Sr.No. | Name & Description | Example |
---|---|---|
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 イベントリスナーが適用されないようにし、スライダーを無効にします。 'disabledClass’でJSによってクロスチェックされました。 |
false |
11 |
doubleSided 2つのハンドルを使用でき、JSによってクロスチェックされます。 |
false |
12 |
decimal プラグインが浮動小数点精度のために必要な小数点以下の桁数を表します。 |
2 |
13 |
moveTime ユーザーがバーをクリックしたときに、スライダーハンドルの動きをアニメーション化するときです。 Sass設定で移行時間を更新する場合は、手動で設定する必要があります。 |
200 |
14 |
disabledClass スライダーを無効にするために使用 |
'disabled' |
イベント
これらのイベントは、Sliderプラグインが接続されている任意の要素からトリガーされます。 _moved.zf.slider_は、ハンドルの移動が完了するとトリガーされます。
関数
_.destroy_は、スライダープラグインを破棄するために使用されます。