jQueryでスクロールしたタイミングで表示/非表示のアニメーションを繰り返す

jQueryのアニメーションとCSSでなんちゃってパララックスを作ってみたでご紹介した方法を少しアレンジして、の表示/非表示がスクロールするたびに繰り返されるようにしました。
ソースは以下をご参照ください。

jQueryの書き方

スクロール値が指定値を越えたらフェードインして、それより少なくなったらフェードアウトする仕組みです。

//スクロール値ごとの動きを設定
$(function() {
	$(window).scroll(function () {
		var top = $(this).scrollTop();
		if(top > 150) {
			$("#box1").fadeIn('800');
		}else {
			$("#box1").fadeOut('800');
		}
		if(top > 900) {
			$("#box2").fadeIn('800');
		}else {
			$("#box2").fadeOut('800');
		}
		if(top > 1600) {
			$("#box3").fadeIn('800');
		}else {
			$("#box3").fadeOut('800');
		}
	});
});