no-image

JavaScript

レスポンシブ対応でモバイルフレンドリーなjQueryデートピッカー・タイムピッカー「pickadate」

pickadateはレスポンシブに対応したモバイルフレンドリーなデートピッカー・タイムピッカーを実装できるjQueryプラグインです。軽量でサクサク動作するのでとても快適です。

pickadate

デモ

デモでは「Try me…」と書かれたボックスが2つ設置されています。上にあるのが日付を指定するデートピッカー、下にあるのが時間を指定するタイムピッカーになっています。

デートピッカーでは大きめのカレンダーが表示されるのでとても見やすく選択もしやすい印象です。タイムピッカーでは縦長に30分単位で時間を選択できるようになっています。こちらはスクロールしながらシンプルに時間を選べるのでスマホやタブレットなどのモバイルでの操作性はとてもよさそうですね。

また、pickadateはタッチやキーボードによる操作も可能になっているほか、40以上の言語翻訳も付いてきます。

サポートされているブラウザは、すべてのモダンブラウザとIE8+とのこと。ライセンスはMITになります。

というわけで、軽量でレスポンシブに対応したモバイルフレンドリーなデートピッカー・タイムピッカーを実装できるjQueryプラグイン「pickadate」の紹介でした。

pickadate

関連記事

  1. Simple Modal

    JavaScript

    レスポンシブ対応の軽量・シンプルなモーダル「Simple Modal」

    Simple Modalはレスポンシブに対応した軽量でシンプルなモーダ…

  2. WD_ImageStax

    JavaScript

    山積みされた写真をシャッフルさせるフォトギャラリー「WD_ImageStax」

    WD_ImageStaxは無造作に山積みされた写真をシャッフルさせるフ…

  3. jQueryでウィンドウサイズによって処理を変える

    JavaScript

    jQueryで$.inArrayを使えば配列の中に指定した値が何番目に入ってるか知ることができる

    jQueryで配列の中に自分が指定した値が何番目にあるか知りたい場合は…

  4. Unite Gallery

    JavaScript

    レスポンシブな画像・動画ギャラリーを実装できる「Unite Gallery」

    Unite Galleryは、レスポンシブに対応した画像・動画ギャラリ…

  5. JavaScript

    虫メガネのようにマウスを置いた所を拡大することができるjQueryプラグイン「mlens」

    虫メガネのようにマウスを置いた所を拡大することができるjQueryプラ…

  6. jquery countDownTimer

最近の記事

  1. s9+
  2. SRS-LSR200
  3. QC30
  4. リンツ リンドール

アーカイブ

PAGE TOP