no-image

JavaScript

シンプルでパワフルなセレクトボックスを実装できる「SelectPage」

SelectPageはシンプルながらも高いカスタマイズ性を備えたパワフルなセレクトボックスを実装できるjQueryプラグインです。ページネーションやキーボード操作、多言語対応などハイクオリティなセレクト機能を取り入れたい場合に最適なプラグインになります。

SelectPage

デモ

デモではページネーション付きのベーシックなものからセレクトオンリーのモード、選択済みのもの、複数選択ができるモード、選択できる数の上限が決まっているタイプ、Ajax使用のものなど、さまざまな種類のサンプルが用意されています。

例えば、ベーシックタイプでは「input to search」という項目をクリックすると、アイテムを選択できるボックスが表示されます。ボックス下部にはページネーションも設置されていて、矢印をクリックすることで次のページに移ることができるほか、キーボード操作にも対応していることから左右の矢印キーからでもページを切り替えることが可能です。

また、複数選択モードでは選択されたアイテムがタグのように表示されます。各アイテムの横にはバツ印が付いていて、ここから選択を外すことが可能です。ちなみに複数選択を有効にするにはオプションのmultipleという項目の値をtrueに設定してあげればOKです。さらに選択できるアイテム数の上限を設定したい場合はmaxSelectLimitから設定できます。例えば、選択可能なアイテム数を3つまでにしたい場合は、ここの値を3に設定します。

SelectPageは複数言語にも対応していて、こちらはオプションのlangから指定可能です。chinese、english、german、spanish、japanse、Brazilian Portugueseの6つの言語から選択できます。コードはchineseがcn、englishがen、germanがde、spanishがes、japanseがja、Brazilian Portugueseがpt-brです。

オプションには他にも、data、pagination、listSize、multipleControlbar、selectToCloseList、initRecord、dbTable、keyField、showField、searchField、andOr、orderBy、pageSize、params……など、たくさんの種類が用意されています。

SelectPage

Relax Melodies48種類のリラックスサウンドで睡眠時や作業中のBGMに最適なMacアプリ「Relax Melodies」前のページ

水平・垂直に対応したカルーセルスライドショー「jCarousel」次のページno-image

関連記事

  1. jQuery Accordion

    JavaScript

    シンプルで実用的なアコーディオン実装「jQuery Accordion」

    とてもシンプルで操作性のよいアコーディオン「jQuery Accord…

  2. jR3DCarousel

    JavaScript

    レスポンシブな3Dカルーセルを実装できる「jR3DCarousel」

    jR3DCarouselはレスポンシブな3Dカルーセルを実装できるjQ…

  3. jCalculator

    JavaScript

    jQueryプラグインで電卓を実装できる「jCalculator」

    jCalculatorというjQueryプラグインを使えば入力フィール…

  4. PreViewTube.js
  5. nanogallery2

    JavaScript

    美しくてハイクオリティなイメージギャラリーを実装できる「nanogallery2」

    nanogallery2はパーソナルニーズにピッタリなイメージギャラリ…

  6. JavaScript

    マウスオーバーなどで画像を拡大してくれるシンプルなjQueryプラグイン「jQuery Zoom」

    マウスオーバーなどで画像を拡大してくれるシンプルなjQueryプラグイ…

最近の記事

  1. 長十郎
  2. COMOLI シルクネルシャツ
  3. WiMAX
  4. 甘柿
PAGE TOP