skrollr.jsを使ったパララックスとinview.jsを使ったフェードインなどのエフェクトを使用する際の備忘録です！

まずはデモサイトです。
DEMO

猫の写真部分は各種フェードイン、雪の背景の部分はパララックス、カラフルな四角形が並んでいる部分はパララックスとフェードインを使用しています。
右下のにはフェードインで現れその後ページ下部までずっとくるくる回っているバーにskrollrを使用しています。

詳細は省きますが、画面が入った時点で下から上にフェードインするエフェクトが画面上部に到着した際にチラチラと表示と非表示を繰り返すので縦のフェードインのみ発火するのは一度きりにし、画面外に出てもフェードアウトしないように設定します。