parallaxを実装するのに最適なライブラリ

この間 natsu.me を parallaxとmedia-queryを利用したレスポンシブ・ウェブデザインに対応したんだけど、parallaxを使う上で色々ライブラリを探して、結局 skrollr を使うようにした。

他のライブラリで

• jQuery-Parallax
• Jarallax
• cool-kitten
• Parallaxjs
• Parallax-JS

があったけど、どれもjQueryのプラグインで提供されてたり、npmいれてgrunt実行でコード生成して使ってねとか不親切だったり、javascriptを書いてくれってのばっかだった。（npm入れてはまだいいけど他はちょっと遠慮したいね。）

でもskrollrは違った、単独のライブラリでjQueryを必要としてないし、何よりjsを書かなくて良かった。動かしたいelementにdata-x="css: hoge;"だけで動く。
さらにskrollr-stylesheetsというpluginを入れるとそれすら必要なく、cssに全部記述するだけでparallaxが実現出来る。つまりjsが書けないデザイナーだけで簡単にparallaxを使ったサイトが作れる。マジ便利。

ということでparallaxを使ったサイトを作りたい場合はskrollr一択です。
じゃっかん不便に感じたのがskrollr-stylesheetsでjarallaxを書いたcssファイルとmedia-queryを一緒に出来ないってのとjarallaxのセレクタ（というか変数）にハイフンが使えない事。
ハイフンが使えないのはさすがにcssファイル内の命名規則がおかしくなるのでpull request送った。取り込んでくれたら使えるようになるはず。