jquery.sticky粘性ローリングプラグインの使用

あなたのページ上の任意の要素が常に見えるようにすることができますA jQueryプラグインは、それはトップの固定ナビゲーションなどのプラグを表示することができます。

公式ウェブサイトのアドレス：http://stickyjs.com/

githubの：https://github.com/garand/sticky

プラグインは、コアライブラリを導入する必要JQによって異なります！

ブログのナビゲーションは、このプラグインを使用して静止

<SCRIPT SRC = "jquery.js"> </ SCRIPT> 
<SCRIPT SRC = "jquery.sticky.js"> </ SCRIPT> 
<SCRIPT> 
  $（ドキュメント）.ready（関数（）{ 
    $（ "#sticker" ）.sticky（{topSpacing：0 }）; 
  }）; 
</ SCRIPT>

アンバンドリングスティッキー

<スクリプト> 
  $（ "#sticker" ）.unstick（）;
</ SCRIPT>

オプション

topSpacing（デフォルト： 0）上部とページ要素の上部との間のピクセル。
bottomSpacing（デフォルト： 0）ページの底部及び要素の下部との間のピクセル。
className::（デフォルトは 'is-sticky'時に「貼り付け」CSSクラスのラッパー要素に追加されました）。
wrapperClassName：（デフォルト： 'sticky-wrapper'）ラッパーへのCSSクラス。
center（デフォルト： false）要素は、ページの粘度レベルの中央になければならないかどうかを決定するため。
getWidthFrom（デフォルト： ''）「粘着性」要素の固定幅を設定するため、セレクタ要素によって参照されます。
widthFromWrapper：（デフォルト： true）それはラッパーの幅に合わせて、幅「スティッキー」要素を更新するかどうかを決定するブール値。パッケージングは、固定要素のプレースホルダ（静的要素が含まれていない）固定され、その幅は、コンテキストとCSSルールに応じ。のみgetWidthForm提供されない場合に有効。
responsiveWidth（デフォルト： false）ウィンドウは幅を再計算（getWidthfromを使用して）サイズ変更されたかどうかを示すブール値
zIndex（デフォルト： inherit）z屈折率制御要素が貼り付け

イベント

sticky-start：要素が粘着性になると。
sticky-end要素は、元の位置に戻された場合：
sticky-update：要素を貼り付けますが、ために制約の理由は、場所を更新する必要がある場合
sticky-bottom-reached要素は、下のスペースの制限に達した場合：
sticky-bottom-unreached：要素は、スペースの制限の下に達していない場合

<スクリプト> 
  $（ '#sticker'）上の（ 'スティッキー起動'、関数（）{にconsole.log（ "開始" ）;}）; 
  $（ '#sticker'）（ '粘着末端'、オン。関数（）{にconsole.log（ "エンド" ）;}）; 
  $（ '#sticker'）上の（ 'スティッキー更新'、関数（）{にconsole.log（ "更新" ）;}）; 
  $（ '#sticker'）上の（ 'スティッキーボトム到達'、関数（）{にconsole.log（ "底部に到達" ）;}）; 
  $（ '#sticker'）上の（ 'スティッキーボトム未到達' 関数（）{にconsole.log（ "ボトム未達" ）;}）;

jquery.sticky粘性ローリングプラグインの使用

オプション

イベント

おすすめ