syncscrollは2つ以上のスクロールエリアを同時にスクロールできるJSライブラリです。軽量で使い方もシンプルなところがいいですね。片方をスクロールした時に、もう片方を同時にスクロールさせたい時に便利です。
syncscroll
以下はsyncscrollのデモになります。
3つのテキストで書かれたエリアを同時にスクロールさせたり、2つの地図を並べて同時に動かせたりと、応用次第でいろいろと活用できますね。
使い方は、syncscrollのファイルを読み込んだ状態で、このようにマークアップするだけです。
<div class=syncscroll name=myElements> sample text </div> <div class=syncscroll name=myElements> sample text </div>
クラス名にsyncscrollを付与し、name属性を同じ値にすればOKです。
というわけで、2つ以上のエリアを同時にスクロールさせたい方は、ぜひチェックしてみてください。