jQueryプラグイン:pagetop

jQueryプラグイン:pagetop

author : koki

publish date :

ページトップへ移動するボタンを簡単に実装するjQueryプラグインを作りました。

いたってシンプルなプラグインです。今までサイト構築のたびに個別にcommon.jsにゴニョゴニョと書いていたのですが、いい加減面倒になってきたので今後はこれを使いまわそうと思います。
という、かなり個人的な理由で開発したプラグインですがもし良かったらどうぞ。

サンプルコード

HTMLコード

1
2
3
<ul class="pageTop">
    <li><a href="#header"><img src="/path_to/image.png" width="42" height="42" alt="pageTop"></a></li>
</ul>

CSSコード

1
2
3
4
5
6
7
.pageTop{
    position: fixed;
    bottom: 40px;
    right: 40px;
    display: inline;
    margin: 0;
}

JavaScriptコード

1
2
3
jQuery(function($){
    $('.pageTop').pageTop();
});

オプション

オプションデフォルト値補足
autoHidetruetrueを指定した場合、トップへ移動するボタンは一定量スクロールするまで表示させません。
falseを指定した場合、常に表示されます。
ratio0.3トップへ移動するボタンを表示させるスクロール量の割合。
autoHideがtrueの時のみ有効。
指定できる最大は1です。
animateTime500トップへ移動するボタンを表示させる秒数(ミリ秒)。

情報

日付内容
2014-12-12バージョン1.0.0を公開