パララックスエフェクトは見ている人にちょっとした違和感を与え、注目を集めるのに使えます。しかしスクロール時の処理を実装するのは大変で、後々のメンテナンスも面倒です。 そこで専用ライブラリの利用をお勧めします。今回紹介するのはsimpleParallax.jsです。

simpleParallax.jsの使い方

デモです。まずはベーシックな動きから。

こちらは横（左から右）に動いています。

こちらは逆に右から左に。表示されている枠も動いています。

simpleParallax.jsはHTML内に表示されている画像をパララックスエフェクトするというシンプルなライブラリです。しかし、遅延させたり、動きを上下だけでなく左右に制御するなど細かく指定できます。simpleParallax.jsならば、画像を差し替えるだけで新しい見た目に変えられるので手軽そうです。

simpleParallax.jsはJavaScript製のオープンソース・ソフトウェア（MIT License）です。

simpleParallax.js - a JavaScript library for parallax effects geosigno/simpleParallax.js: Simple and tiny JavaScript library which adds parallax animations on any images