jquery.datepicker

JavaScript

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

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

jquery.datepicker

デモ

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

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

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

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

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

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

jquery.datepicker

Building a Vertical Timeline With CSS and a Touch of JavaScriptレスポンシブに対応した垂直タイムライン「Building a Vertical Timeline With CSS and a Touch of JavaScript」前のページ

レスポンシブ対応で多階層なドロップダウンメニューを実装できる「DropDownMenu」次のページDropDownMenu

関連記事

  1. no-image

    JavaScript

    水平・垂直に対応したカルーセルスライドショー「jCarousel」

    jCarouselは水平・垂直に対応したカルーセルスライドショーを実装…

  2. JavaScript

    Lightbox風のjQueryプラグインColorBoxの使い方

    綺麗なイメージギャラリーを簡単に設置できるColorBoxの使い方の紹…

  3. Create a month picker jQuery plugin
  4. JavaScript

    縦スクロールすると横スクロール(水平移動)していくjQueryプラグイン「jInvertScroll…

    これおもしろいですね。縦スクロールすると垂直に移動していくのではなくて…

  5. nanogallery2

    JavaScript

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

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

  6. slider Menu

    JavaScript

    メニューリストをスライダーメニューにするjQueryプラグイン「slider Menu」

    slider Menuはメニューリストをスムーズにスライダーメニューに…

最近の記事

  1. クッキー&クリーム ポップコーン
  2. マウイチップス マウイオニオン味
  3. グリーンビーントゥーバー
  4. VS-543AS

アーカイブ

PAGE TOP