CSSだけのパララックススクロール

background-attachment: fixed; を指定することで、
パララックススクロールしているように見せています。

CSS

#parallax_wrap .parallax {
	position: relative;
	padding-top: 60%;
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: fixed;
	background-size: cover;
}
#parallax01 {background-image: url(img/parallax01.jpg);}
#parallax02 {background-image: url(img/parallax02.jpg);}
#parallax03 {background-image: url(img/parallax03.jpg);}
#parallax04 {background-image: url(img/parallax04.jpg);}
.break {
	background: #fff;
	height: 300px;
}

 
HTML

<div id="parallax_wrap">

	<div id="parallax01" class="parallax"></div>

	<div class="break"></div>

	<div id="parallax02" class="parallax"></div>

	<div class="break"></div>

	<div id="parallax03" class="parallax"></div>

	<div class="break"></div>

	<div id="parallax04" class="parallax"></div>

</div>

サンプルページはこちら

Firefox、Chrome、IE8+で動作確認。
※IE7以下は background-attachment: fixed; に対応していないため動作しません。
※また、IE8では background-size: cover; に対応していないため、背景画像が画面いっぱいに表示されません。