こんにちは。
今回はjQueryで上スクロールと下スクロールで違う処理をする！です。
広告とかを表示したい時等にたまに上スクロールと下スクロールで違う処理をしたい時ってありますよね。
今回はそれのメモ書きです。
[javascript]
$(function() {
var before = $(window).scrollTop();
$(window).scroll(function() {
var after = $(window).scrollTop();
if(before > after) {
上スクロールした時の処理
}
else if(before < after) {
下スクロールした時の処理
}
before = after;
});
});
[/javascript]
beforeという変数が最初のスクロールの位置を取得しています。
afterが後のスクロールの位置を取得していますよ。
beforeがafterより大きい時は上スクロールになります。
その反対でbeforeがafterより小さい時は下スクロールになりますよ。
コアjQuery+プラグイン/jQuery UI 開発実践技法 (Programmer’s SELECTION)
ちょっと難しいですが、スクリプトを見るとなるほどという感じですね。
以上でjQueryで上スクロールと下スクロールで違う処理をする！でした。
