ページトップへ移動するボタンを簡単に実装するjQueryプラグインを作りました。
いたってシンプルなプラグインです。今までサイト構築のたびに個別にcommon.jsにゴニョゴニョと書いていたのですが、いい加減面倒になってきたので今後はこれを使いまわそうと思います。
という、かなり個人的な理由で開発したプラグインですがもし良かったらどうぞ。
サンプルコード
HTMLコード
<ul class="pageTop"> <li><a href="#header"><img src="/path_to/image.png" width="42" height="42" alt="pageTop"></a></li> </ul>
CSSコード
.pageTop{ position: fixed; bottom: 40px; right: 40px; display: inline; margin: 0; }
JavaScriptコード
jQuery(function($){ $('.pageTop').pageTop(); });
オプション
オプション | デフォルト値 | 補足 |
---|---|---|
autoHide | true | trueを指定した場合、トップへ移動するボタンは一定量スクロールするまで表示させません。 falseを指定した場合、常に表示されます。 |
ratio | 0.3 | トップへ移動するボタンを表示させるスクロール量の割合。 autoHideがtrueの時のみ有効。 指定できる最大は1です。 |
animateTime | 500 | トップへ移動するボタンを表示させる秒数(ミリ秒)。 |
情報
日付 | 内容 |
---|---|
2014-12-12 | バージョン1.0.0を公開 |