parallax.js
まずは実装サンプルを確認。iOS, android非対応です。
ファイルの読み込み&呼び出し
/templates/footer.htmlに以下のソースを張り付ける。
<script src="https://cdn.jsdelivr.net/parallax.js/1.4.2/parallax.min.js"></script>
<script>
$('.parallax-window').parallax({
imageSrc: '/images/img/SCT_6430.JPG',
speed:0.3
});
</script>
cssの記述
.parallax-window {
min-height: 400px;
}
htmlの記述
<div class="parallax-window" data-parallax="scroll" data-image-src="/images/img/SCT_6430.JPG"></div>