Picker

JavaScript

iOSのようなピッカーを実装できるJSライブラリ「Picker」

Pickerは、iOSのUIのようなピッカーを実装することができるJSライブラリです。選択画面のアイテムリストはとても滑らかに動作します。特にスマホやタブレットからの操作は快適です。

複数の列にも対応

デモ

デモページでは、各項目をクリックするとアイテムを選択する画面が下からスライドで表示されます。選択画面の領域以外の場所にはオーバーレイがかかるので、アイテムを選択することに集中しやすいです。

スマホからの場合は、タッチに対応しているのでアイテムも直感的に上下に動かすことができます。パソコンからの場合はドラッグしながら上下にアイテムを動かすことが可能です。

任意のアイテムを選択したら、選択画面の右上にある「確定」をクリックすればOKです。キャンセルする場合は左上にある「取消」を選択します。

シンプルなデザイン&レイアウトで動作もとても滑らかなので、特にスマホやタブレットでは直感的に操作できると思います。

オプションには、options.title (String)、options.data (Array)、options.selectedIndex (Array)が用意されているほか、picker.change、picker.select、picker.cancel、picker.valuechangeといったイベントのセッティングなども可能です。

また、選択する列も単一だけではなく複数の列にも対応しています。カスタマイズ性にも優れているiOSライクなピッカーを実装したいという人は、ぜひ「Picker」をチェックしてみてください。

Picker

Complexifyパスワードの強さを視覚的にフィードバックしてくれる「Complexify」前のページ

オシャレなスクロールエフェクトを実装できる「jQuery Smoove」次のページno-image

最近の記事

  1. スマトラ
  2. さくらドーナツ
  3. 紙のコーヒーフィルター
  4. PS5とFF7リメイクと鉄拳8
PAGE TOP