jQueryのパララックスのプラグイン「Nikebetterworld Parallax Effect」のサンプルデモデータを使って熊本旅行のパララックスサイトを作りました。

jQueryのパララックスのプラグインの定番の「Nikebetterworld Parallax Effect」のサンプルデモデータを使って熊本旅行のパララックスサイトを作りました。

熊本旅行2013のパララックス
http://www.vivo-one.biz/kumamoto_travel_parallax/ 

パララックス効果の指定の方法はとても簡単で、用意されている関数　parallax（）　にパラメーターを渡してあげるだけです。 下記の部分が該当の箇所です。

$('#nav').localScroll(800);

//.parallax(xPosition, speedFactor, outerHeight) options:
//xPosition - Horizontal position of the element
//inertia - speed to move relative to vertical scroll.
// Example: 0.1 is one tenth the speed of scrolling,
// 2 is twice the speed of scrolling
//outerHeight (true/false) - Whether or not jQuery should use 
// it's outerHeight option to determine 
// when a section is in the viewport

$('#intro').parallax("50%", 0.1);
$('#second').parallax("50%", 0.1);
$('.bg').parallax("50%", 0.4);
$('#third').parallax("50%", 0.3);
$('#fourth').parallax("50%", 0.1);
$('.bg2').parallax("50%", 0.4);

Nikebetterworld Parallax Effect
http://ianlunn.co.uk/articles/recreate-nikebetterworld-parallax/