今週はスクロールの動きの参考をご紹介します。
慣性スクロールとは…
主にマルチタッチインターフェースで採用されている機能で、画面を素早くスクロールさせた際、指を画面から離しても急には止まらず、慣性が作用しているようにスクロールがある程度維持される機能のことである。
だそうですiPhoneやAppleのMagic Mouseを使っている人は想像しやすいかと思います。スクロールしたときに、通常はスクロールした分だけしか画面が動きませんが、慣性スクロールの場合は、スクロールを止めてもふわっと動く、そんなイメージです。
言葉で説明するのは難しいので、こちらのサイトで実感してみてください！
この動きについてですが、「Luxy.js」というプラグインを使用すると簡単に実装できるようです。
使い方については、こちらのブログでわかりやすく紹介されていたのでご参考に。
1点注意があり、こちらのプラグインは適応させたい範囲を<div id="luxy">で囲む必要がありますが、cssの記述でposition: fixed などの固定要素を入れると、うまく動作しないようです。そのため、固定したい要素(ヘッダーなど)は除外して適応範囲を囲む必要があります。
実装じたいはそんなに難しくないので、これを導入するだけでサイトの雰囲気が一気に変わりますね！
以上、本日は慣性スクロールのjsプラグインをご紹介しました！
