ScrollBooster

JavaScript

ドラッグしながらスクロールするライブラリ「ScrollBooster」

ScrollBoosterはドラッグしながらスクロールする機能を実装できるライブラリです。テーブルや画像などのコンテンツを任意の領域内でドラッグスクロールしながら見せることができるので、使いどころによってはとても便利な機能ですね。

ScrollBooster

デモ

デモではテーブルや画像といったコンテンツにこの機能が実装されています。例えば、一番上のテーブルでは、テーブル内にカーソルを持っていくとカーソルが十字の矢印に切り替わります。この状態で左右にドラッグすることで横にスクロールしていくことが可能です。

特定の領域内にたくさんのデータを詰め込みたい場合に役立つ機能ですね。

同様に、画像のデモでは左右だけではなく上下のドラッグスクロールもできるようになっています。ユーザーに拡大画像を特定の領域内でスクロールしながらじっくり見せたい場合にはとても便利な機能です。

オプションには、viewport、content、handle、bounce、textSelection、friction、bounceForce、emulateScroll、onUpdateといった項目のセッティングが可能になっています。

その他、メソッドにはsetPosition、updateMetrics、getUpdate、destroyが用意されています。

サポートされているブラウザは、IE 11、Edge、Chrome、Firefox、Safari。ライセンスはMITとのこと。

ScrollBooster

3D Touchによるカーソル移動iPhoneの3D Touchによるカーソル移動や選択範囲の指定が便利すぎる前のページ

フルスクリーンによるjQueryモーダルウィンドウ実装「FullMod」次のページno-image

関連記事

  1. Brusher

    JavaScript

    インタラクティブな背景を実装できる「Brusher」

    Brusherはインタラクティブな背景を実装できる軽量なJavaScr…

  2. JavaScript

    スクロールバーにあと何分で読めるかを表示してくれるjQueryプラグイン「jQuery Readin…

    とてもシンプルですが何気に便利そうだったので使ってみました。長文記事を…

  3. JavaScript

    スクロールしても固定表示されてついてくるjQueryプラグイン「Sticky」

    StickyというjQueryプラグインを使えば、スクロールしても固定…

  4. no-image
  5. Stripe.Com Navigation

    JavaScript

    コンテナがアニメーションで可変するナビゲーション「Stripe.Com Navigation」

    ナビゲーションメニューのコンテナがアニメーションで可変するドロップダウ…

  6. PIGNOSE Calendar

    JavaScript

    美しくてシンプルに使えるデートピッカー実装「PIGNOSE Calendar」

    PIGNOSE Calendarは、美しくてシンプルな操作性によるデー…

最近の記事

  1. ダミアン・ハースト 桜
  2. パッキングエリア
  3. あらびきソーセージパイ
  4. REACH フロス
PAGE TOP