jQuery.Bottom
ページを最後までスクロールさせたら、何らかの処理を行いたいときに使えるプラグインです。ツイッター等のSNSでよく見られる自動ロードや、最後までスクロールしたら現れるトップへもどるボタンなど、色々とお世話になることが多そうです。
こちら自分のフォトギャラリーを作るときに利用させてもらいました。
用意するもの
用意するものは、jQueryとjquery.bottom.jsの２つです。この他に、最後までスクロールしたときに発生させたいイベント用のjsも必要なことが多いかもしれませんね。
<script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.bottom-1.0.js"></script>
基本的な書き方
記述自体はシンプルで簡単です。オプションなどについては、公式で確認すると良いでしょう。
$(function() {
$(window).bottom();
$(window).on('bottom', function() {
//最後までスクロールしたときに発生させたい処理を記述
});
});
このプラグインでは、.bottom();で指定した要素に対して効果を発揮。なので、ページ全体が最後までスクロールしたときにイベントを発生させるだけではなく、特定の要素（例えば$(‘#contents’)みたいな）を指定すればその要素の最後までスクロールしたときにイベントを発生させることも出来ます。
注意点
このプラグインは、シンプルに指定要素の最後までスクロールされたら何度でも瞬時にイベントを発生させるという点で注意が必要です。
なので一回の処理で良い場合や、発生したイベントの処理が終わるまで次のイベントは発生させたくない場合は、それようの条件分岐が必要なのかなーと思います。
