syncscroll

JavaScript

2つ以上のスクロールエリアを同時にスクロールできる「syncscroll」

syncscrollは2つ以上のスクロールエリアを同時にスクロールできるJSライブラリです。軽量で使い方もシンプルなところがいいですね。片方をスクロールした時に、もう片方を同時にスクロールさせたい時に便利です。

syncscroll

デモ

3つのテキストで書かれたエリアを同時にスクロールさせたり、2つの地図を並べて同時に動かせたりと、応用次第でいろいろと活用できますね。

使い方は、syncscrollのファイルを読み込んだ状態で、このようにマークアップするだけです。

<div class=syncscroll name=myElements>
    sample text
</div>

<div class=syncscroll name=myElements>
    sample text
</div>

クラス名にsyncscrollを付与し、name属性を同じ値にすればOKです。

syncscroll

関連記事

  1. no-image

    JavaScript

    円形に広がるメニュー実装「expanding action button」

    expanding action buttonは円形に広がるメニューを…

  2. Shuffle Letters

    JavaScript

    テキストをカシャカシャとシャッフルさせて表示していくjQueryプラグイン「Shuffle Lett…

    テキストをカシャカシャとシャッフルさせて表示していくjQueryプラグ…

  3. jquery.enhsplitter

    JavaScript

    コンテンツを分離できるフレーム実装「jquery.enhsplitter」

    jquery.enhsplitterはコンテンツを分離させるフレームを…

  4. no-image

    JavaScript

    シンプルなバナースライドショーを実装できる「jsslider」

    jssliderはシンプルなバナースライドショーを実装できるjQuer…

  5. Tilt Hover Effects

    JavaScript

    ホバーによるチルトエフェクトを実装できる「Tilt Hover Effects」

    指定したアイテムにホバーすることでオシャレなチルトエフェクトを実装する…

  6. nuContextMenu

    JavaScript

    モダンなコンテキストメニューを実装できる「nuContextMenu」

    nuContextMenuはモダンで軽量なコンテキストメニューを実装で…

最近の記事

  1. Olli
  2. 単語帳メーカー(Flashcard Maker App)
  3. 1Password 7
  4. 風に揺れる草

Facebookページ

PAGE TOP