PopSelect

JavaScript

タグ形式のセレクトボックスをポップオーバーで表示させる「PopSelect」

PopSelectはタグ付けするような感覚のセレクトボックスをポップオーバーで表示させることができるjQueryプラグインです。ボックス内をクリックすると予め設定されたセレクトメニューがポップオーバーで表示されます。

PopSelect

PopSelect

セレクトメニューがタグ形式になっており、選択するとボックス内にタグが追加されます。

追加したタグを削減したい時はマウスオーバーすると横にバツ印が表示されるので、そこをクリックすると削減されます。また、deleteキーにも対応しています。

オプションもいろいろと用意されており、選択できるタグ数のMAX値やプレースホルダテキスト、表示するポジション(topかbottom)などを設定することができます。

機能もシンプルだし分かりやすく、そして見やすいUIなので、ユーザーにとっての使い勝手は良さそうですね。

そんなわけで、セレクトボックスをタグ形式にしてポップオーバー表示させたい方は、ぜひ活用してみてはいかがでしょうか。

Pocketのリスト並べ替えPocket(Web版)で記事リストを最新から最古に並べ替える設定方法前のページ

Chromeで外国語のWebサイトのページを翻訳する方法次のページChromeで翻訳する方法

関連記事

  1. ax5ui-menu

    JavaScript

    カスタマイズしやすいコンテキストメニューを実装できる「ax5ui-menu」

    ax5ui-menuはカスタマイズしやすいシンプルなコンテキストメニュ…

  2. no-image

    JavaScript

    ミニマルでダイナミックなLightboxプラグイン「darkbox.js」

    darkbox.jsはミニマルながらもダイナミックなLightbox風…

  3. mmenu

    JavaScript

    スマホアプリのように横からスライドするメニューのjQueryプラグイン「mmenu」

    mmenuというjQueryプラグインを使えば、スマホアプリのように横…

  4. no-image

    JavaScript

    ミニマルなイメージギャラリーを実装できる「Albery」

    Alberyはミニマルなイメージギャラリーを実装できるjQueryプラ…

  5. Tippy.js

    JavaScript

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

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

  6. simpleSlideShow

    JavaScript

    カスタマイズしやすいシンプル・軽量なスライドショー「simpleSlideShow」

    simpleSlideShowは、シンプルで軽量なスライドショーを実装…

最近の記事

  1. エチオピア
  2. 紗々 飴色和栗
  3. DCG-CA21
  4. Apple WatchでのMacロック解除を無効
  5. オータムスイートポテトフラペチーノ

アーカイブ

PAGE TOP