flatpickr

JavaScript

超軽量で使い方もカンタンな日付ピッカー「flatpickr」

flatpickrはjQueryなどのライブラリに依存することなく動作する、超軽量な日付ピッカーです。バニラJavaScriptで記述されているとのこと。日付ピッカーのフラットなデザインもシンプルでとても見やすいですね。使い方もカンタンなところがいいと思います。

flatpickr

デモ

Try me…と書かれたボックスをクリックすると、ベーシックなタイプのサンプルが表示されます。すっきりしたフラットデザインの日付ピッカーがとても素敵です。ピッカー上部の左右にある矢印で、前後の月に切り替えることができます。特定の日付を選択すると、ボックス内にその値が入力されます。

ほかにも複数のピッカーを設置したり、入力される値のフォーマットを変更したり、いろいろとカスタマイズして使うことも可能です。

日付だけでなく、時間を指定するタイムピッカーとしても活用できるので、軽量ながらパワフルにさまざまなサイトで活用できるのではないでしょうか。

またオプションも、dateFormat、timeFormat、defaultDate、minDate、maxDate、disableなどなど、たくさんの項目が用意されているので、自サイトに合わせたカスタマイズをしたい方にもうれしいポイントだと思います。

flatpickr

関連記事

  1. no-image

    JavaScript

    背景にSVGによるライン(線)をランダムで生成する「ckLine.js」

    ckLine.jsは背景にSVGによるライン(線)をランダムで生成する…

  2. Naver

    JavaScript

    シンプルですごくいい!レスポンシブに合うナビゲーションのjQueryプラグイン「Naver」

    NaverというjQueryプラグインがすごくシンプルでよかったのでご…

  3. Chariot

    JavaScript

    Webページ内でステップごとのガイドツアーを実装できる「Chariot」

    ChariotはWebページ内でのガイドツアーを実装することができるJ…

  4. Raindrops.js

    JavaScript

    水面に雨粒が落ちてくるエフェクトが素敵なjQueryプラグイン「Raindrops.js」

    Raindrops.jsは水面に雨粒が落ちてくる素敵なエフェクトを実装…

  5. no-image
  6. JavaScript

    jQuery MobileでWebサイトをスマートフォン対応にする時に見ておきたい記事のまとめ

    今更ながらようやくjQuery Mobileを使い始めたんですが、基本…

最近の記事

  1. EH-NA0B
  2. KPS-88
  3. Happy Plugs AIR1
  4. cheero Stream 10000mAh
  5. BOSE HOME SPEAKER 300

アーカイブ

PAGE TOP