PopSelect

JavaScript

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

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

PopSelect

PopSelect

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

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

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

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

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

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

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

関連記事

  1. JavaScript

    レスポンシブにも対応している人気のjQueryプラグインのスライダー「Nivo Slider」の使い…

    レスポンシブにも対応している人気のjQueryプラグイン「Nivo S…

  2. Lena.js

    JavaScript

    多彩な画像処理ができるJSライブラリ「Lena.js」

    Lena.jsは多彩な画像処理を行うことができるJSライブラリです。セ…

  3. Animated Heat Distortion Effects with WebGL

    JavaScript

    陽炎のような揺れを表現できる「Animated Heat Distortion Effects wi…

    夏の暑い日などによく見かける「陽炎」のようなエフェクトを実装することが…

  4. 2013年上半期jQueryプラグインまとめ

    JavaScript

    2012年に紹介したjQueryプラグインのまとめ

    当ブログで2012年にご紹介したjQueryプラグインをまとめてみまし…

  5. JavaScript

    縦スクロールすると横スクロール(水平移動)していくjQueryプラグイン「jInvertScroll…

    これおもしろいですね。縦スクロールすると垂直に移動していくのではなくて…

  6. Hamburger Icon Menu

最近の記事

  1. 広尾 スタバ
  2. 芳醇な香りのラムレーズンサンド
  3. Aモーニングセット
  4. 白トリュフの塩パンやメロンパンなど
  5. 東京都現代美術館

アーカイブ

PAGE TOP