Foundation-sticky-javascript-reference
プラグインスティッキーJavaScriptリファレンス
Foundationは、以下に示すように、Stickyプラグイン用のJavaScriptコンポーネントを提供します。
初期化中
_foundation.sticky.js_および_foundation.core.js_プラグインを使用して、JavaScriptでスティッキーを初期化できます。 プラグインには、次のライブラリが必要です-
- foundation.util.triggers.js
- foundation.util.mediaQuery.js
Foundation.Sticky
以下で定義されるように、スティッキーのインスタンスを指定します-
var elem = new Foundation.Sticky(element);| Sr.No. | Name & Description | Type |
|---|---|---|
| 1 |
element jQueryオブジェクトをスティッキーに作成します。 |
jQuery |
| 2 |
options デフォルトのプラグイン設定はオーバーライドされます。 |
Object |
プラグインオプション
次のプラグインを使用して、スティッキーインスタンスをカスタマイズできます。 プラグインオプションを個別のデータ属性として設定できます。
| Sr.No. | Name & Description | Example |
|---|---|---|
| 1 |
container 独自のクラスをスタイル設定およびサイズ設定するために含めることができます。 |
' ' |
| 2 |
stickTo 要素がくっつく位置を設定します。 |
'top' |
| 3 |
anchor 単一の要素に固定されているその要素のIDが含まれます。 |
'exampleId' |
| 4 |
topAnchor より多くの要素がアンカーポイントとして使用される場合、上部のアンカーIDを考慮します。 |
'exampleId:top' |
| 5 |
btmAnchor より多くの要素がアンカーポイントとして使用される場合、下のアンカーIDを考慮します。 |
'exampleId:bottom' |
| 6 |
marginTop 最上部の要素がスティッキーになったときにemのマージンを設定します。 |
1 |
| 7 |
marginBottom 下の要素がスティッキーになったときのemのマージンを設定します。 |
1 |
| 8 |
stickyOn ブレークポイント文字列はスティッキーになります。 |
'medium' |
| 9 |
stickyClass クラスをスティッキー要素に適用し、破壊時に削除します。 |
'sticky' |
| 11 |
containerClass クラスをスティッキコンテナに適用します。 デフォルトでは、_sticky-container_です。 |
'sticky-container' |
| 12 |
checkEvery スティッキーポイントは、プラグイン間のスクロールイベントの数によって再計算されます。 |
50 |
イベント
任意の要素に付加されたスティッキープラグインは、次のイベントをトリガーできます。
| Sr.No. | Name & Description |
|---|---|
| 1 |
stuckto.zf.sticky $ elementが_position：fixed; _になり、Namespacedが_top_または_bottom_になったときにイベントをトリガーします。 |
| 2 |
unstuckfrom.zf.sticky $ elementが_top_または_bottom_に固定され、名前空間になったときにイベントをトリガーします。 |
関数
以下は、スティッキーで使用される関数です。
._pauseListeners
イベントをスクロールするには、ハンドラーが削除され、イベントがアンカーに変更されます。
| Sr.No. | Name & Description | Type |
|---|---|---|
| 1 |
scrollListener ウィンドウには、一意の名前空間スクロールリスナーが添付されます。 |
string |
._calc
すべての_scroll_イベントで計算が呼び出され、キャッシュされた値とブール値に応じて__init_が関数を起動します。
| Sr.No. | Name & Description | Type |
|---|---|---|
| 1 |
checkSizes プラグインは、trueに設定されている場合、サイズとブレークポイントを再計算します。 |
Boolean |
| 2 |
scroll cb関数から渡されるイベントの現在の位置をスクロールします。 それ以外の場合、デフォルトで_window.pageYOffset_に設定されます |
Number |
。破壊する
現在のスティッキー要素は破棄されます。要素は最上部にリセットされます。 クラスとcssプロパティを含むJSを削除します。JSが_ $ container_を含む場合、_ $ element_はラップ解除されます。
.emCalc
ヘルパー関数は、em値を計算するために使用されます。
| Sr.No. | Name & Description | Type |
|---|---|---|
| 1 |
Number emの数はピクセルで計算されます。 |
em |
