jquery.datepicker

JavaScript

未来的なデータピッカーを実装できる「jquery.datepicker」

jquery.datepickerはWeb用の未来的なデータピッカーを実装することができます。カレンダー内で開始する日を選択できたり、その日から任意の日までを選択した状態にできたりといったことが可能です。

jquery.datepicker

デモ

デモページを読み込むと、シンプルで見やすいカレンダーが表示されます。開始日(スタートデータ)には4日が指定されており、21日までが選択された状態になっています。

4日から21日までの範囲はグレーに色付けされているので、どこからどこまで選択しているのかを把握しやすいのがいいですね。

スタートデータは濃いグレーで、最後に選択したデータは緑で表示されます。シンプルなレイアウトとスッキリしたデザインのカレンダーにより、目的の日付を選択しやすいデータピッカーに仕上がっている印象です。

カレンダー上部の左右の矢印をクリックすれば、前後の月に手軽に移動することもできます。

また、API Referenceを利用すること多彩なカスタマイズもできるので、自サイトに合わせたデータピッカーを作り込みたい人にもうれしい仕様といえるのではないでしょうか?

というわけで、Web用として使う未来的なデータピッカーを実装したいという人は、ぜひ「jquery.datepicker」をチェックしてみてください。

jquery.datepicker

関連記事

  1. vallenato.js

    JavaScript

    シンプルで実装も簡単なjQueryアコーディオン「vallenato.js」

    vallenato.jsは、シンプルで簡単に実装することができるjQu…

  2. SWAPMYLI

    JavaScript

    スライドが切り替わるタイミングも分かりやすく表示させるギャラリーを実装できるjQueryプラグイン「…

    シンプルでよさそうだったのでメモしときます。スライドが切り替わるタイミ…

  3. Rythim.js

    JavaScript

    音楽のリズムに合わせてボタンなどに躍動感を与える「Rythim.js」

    Rythm.jsは、あなたのホームページに躍動感を与えてくれるjsライ…

  4. JavaScript

    レスポンシブに対応している軽量のjQueryスライダー「Unslider」

    とても軽量でレスポンシブにも対応しているjQueryスライダー「Uns…

  5. Blindify
  6. RefineSlide

    JavaScript

    多数のエフェクトが素敵!レスポンシブ対応のjQueryスライダー「RefineSlide」

    多数のエフェクトがあってレスポンシブWebデザインにも対応しているスラ…

最近の記事

  1. Anker PowerCore Lite 20000
  2. ネクスタイム
  3. フォールドオーバーポーチ
  4. 田沢湖
  5. ハクバ シリコンクロス

Instagram始めました

Facebookページ

アーカイブ

PAGE TOP