Listt

JavaScript

リストをiOSのようにアニメーションできるjQueryプラグイン「Listt」

ListtはリストをiOSのセレクトボックスのようにアニメーションさせることができるjQueryプラグインです。ボタンでの操作ができるほか、キーボードの矢印キーにも対応しています。リストをお洒落に縦型アニメーションさせたい人は要チェックです。

上下左右の矢印キーにも対応

デモ

デモではiOSのセレクトボックスのような数字のリストの横に画像付きのコンテンツが表示されています。下にある「PREV」と「NEXT」からリストを垂直にスクロールできるほか、矢印キーからでもスクロールしていくことが可能です。数字のスクロールとともに画像も切り替わる仕組みになっています。

数字のリストがあることで、現在表示されているコンテンツの位置がどの辺か把握できるのでとても便利ですね。

アニメーションや操作がシンプルでとても使いやすいスクローラーです。ちなみに矢印キーは上下だけでなく左右にも対応しています。

マークアップもシンプルでスッキリ記述できるのがグッドです。

Listt

no-imageSVGによるドーナッツ状(円形)のチャートを実装できる「donutty」前のページ

マテリアルデザインによるjQueryタイムピッカー実装「MDTimePicker」次のページno-image

関連記事

  1. jQueryでウィンドウサイズによって処理を変える

    JavaScript

    jQueryのfocusとblurを使えばフォームが便利になる

    jQueryのfocusとblurを使えばフォームを便利にすることがで…

  2. Tippy.js

    JavaScript

    軽量ながらも多彩なツールチップを実装できるJSライブラリ「Tippy.js」

    Tippy.jsは軽量でありながらも多彩なツールチップを実装することが…

  3. Unite Gallery

    JavaScript

    レスポンシブな画像・動画ギャラリーを実装できる「Unite Gallery」

    Unite Galleryは、レスポンシブに対応した画像・動画ギャラリ…

  4. Multi-Screen.js
  5. PhotoJShop

    JavaScript

    写真にエフェクトやフィルタをかけることができるjQueryプラグイン「PhotoJShop」

    PhotoJShopというjQueryプラグインを使えば、写真にエフェ…

  6. jQuery LoadingOverlay

    JavaScript

    多彩なローディング画面を実装できる「jQuery LoadingOverlay」

    jQuery LoadingOverlayは、カスタマイズ性に優れた多…

最近の記事

  1. 桜と太陽
  2. ベルボン Mシリーズ
  3. ネック冷却ファン NRF10
  4. Kindle 8GBモデル
  5. プロテクティングクロス PC-E2

アーカイブ

PAGE TOP