jQueryでParallax「Scrolling Parallax Plugin for jQuery」

画像に奥行き感をもたせられるJavaScript「mParallax」やレイヤー表示（？）JavaScript「jParallax」で紹介したParallaxの縦スクロール版です。
via：Scrolling Parallax Plugin for jQuery

使用方法

Scrolling Parallax Plugin for jQueryからjquery.scrolling-parallax.jsをjQueryからjquery.jsをダウンロードします。

<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.scrolling-parallax.js"></script>
<script>
$(document).ready(function() {
    $.scrollingParallax('画像パス', {
        staticSpeed : 1.7, //スクロールスピード
        loopIt : false, //ループ処理
        staticScrollLimit : false, //スクロールリミット
        bgHeight: '220%', //画像の高さ
    });
});
</script>

また、上に載せるテキストなどはpostionをrelativeにする必要があります。

サンプル

スクロールしてお楽しみください。 Javascriptサンプルページ一覧

skuare.net