multi-list

JavaScript

複数の選択可能なリストにするためのjQueryプラグイン「multi-list」

multi-listは、順序付けされていないリストを複数の選択可能なリストにするための便利なjQueryプラグインです。バラバラに並んでいるリストから、特定のジャンルに関するリストを表示したり文字によるフィルターをかけたりしたいという場合にはピッタリの機能ですね。

文字によるフィルターも可能

デモ

デモでは順序付けされていない地域名が並べられています。「Filter」と書かれたテキストボックスから文字を入力すると、その文字が入っている地域名が抽出されます。

また、下の方にはSelect all、Select Asia、Hide Oceania、Show Oceania、Disable Africa、Enable Africaなど、さまざまなボタンが設置されています。

すべてのチェックボックスにチェックを入れたり、アジアだけのチェックボックスにチェックを入れたり、またはオセアニアを非表示にしたりオセアニアを表示したりと、カスタマイズ次第でいろんなパターンのリストを表示させることができます。

マークアップもシンプルでわかりやすいほか、応用次第で多彩なカスタマイズができそうですね。

文字によるフィルターもかけれるので、たくさんのリストがあるサイトなんかにも大活躍してくれるのではないでしょうか?

選択時、または選択解除時によるイベント設定もできるみたいですよ。

というわけで、順序付けされていないリストを複数の選択可能なリストにすることができるjQueryプラグイン「multi-list」のご紹介でした。

multi-list

関連記事

  1. jQuery.fontFlex
  2. OverlayScrollbars
  3. jquery-scrollstop

    JavaScript

    スクロールの開始・終了時のイベントを設定できる「jquery-scrollstop」

    jquery-scrollstopはスクロールの開始・終了時のイベント…

  4. BeefUp

    JavaScript

    多彩なカスタマイズができるjQueryアコーディオンプラグイン「BeefUp」

    BeefUpは多彩なカスタマイズができるレスポンシブに対応したjQue…

  5. Canvi

    JavaScript

    左右からスライド表示するシンプルなナビゲーションメニュー「Canvi」

    CanviはVanilla JSによるシンプルなナビゲーションメニュー…

  6. Expandy Menu

    JavaScript

    マウスオーバーで広がるメニューパネル「Expandy Menu」

    Expandy Menuはマウスオーバーすると横に広がるメニューパネル…

最近の記事

  1. ブラジルイパネマ
  2. 梅しば
  3. BM-IBCDH13RD
  4. 雪
  5. ホットのドリップ

アーカイブ

PAGE TOP