超クールなカレンダーjavascript「Calendar」に関するコメントはまだありません。
ご遠慮なくコメントしてください。
超クールなカレンダーjavascript「Calendar」
これまで多くのデートピッカーと呼ばれるカレンダーを紹介してきました。
しかし、総じて地味な外見が多かったです。
今回紹介するCalendarは超クールなカレンダーを作成できるjavascriptです。

使用方法
Calendarからcalendar.jsをmootoolsからmootools.jsをダウンロードしてください。
<script src="http://yourdomain/mootools.js" type="text/javascript"></script>
<script src="http://yourdomain/calendar.js" type="text/javascript"></script>
<script type="text/javascript">
window.addEvent('domready', function() {
myCal = new Calendar({
date: 'd/m/Y'
});
});
</script>
上記を記述したら、inputにidとしてdateを付与すれば完成です。
<input id="date" type="text">
ただし、このままだと寂しいカレンダーが表示されます。
このスクリプトの特徴はCSSで簡単に装飾できるところです。
紹介元では、以下のサンプルを含め、3通りを公開しています。
自分で作るのが面倒くさい人はこちらをどうぞmooCalendar.zip
超クールなカレンダーjavascript「Calendar」サンプル
2008年01月09日
前の記事:MacのDockライクなメニューを手軽に作成するjavascript「Fisheye Menu」
次の記事:リンクなどに吹き出し説明を加えるjavascript「Tooltip Plugin」
関連記事
- カレンダー表示&日付選択させるjavascript「Fancy MooTools Date Picker」
- ビジュアル面で最高のタイムピッカーJavaScript「nogray_time_picker」
- [mootools]WysEditor
- [mootools]TimeSpinner
- [prototype]DateChooser
コメント投稿
この記事へのトラックバック:
- ファイルサイズをJavaScriptライブラリ「jQuery」で自動表示する「addSizes.js」
- JavaScriptライブラリ「jQuery」を使用してフォームを華麗に彩る「jqTransform」
- Webカラーに関するサイト21
- 英字新聞ぽいコラムをJavaScriptライブラリ「jQuery」で作る「Columnizer」
- 心地よく要素を切り替えるJavaScript「jFlip」
- CoverFlowを実現するJavaScript「JS Coverflow」
- 画像を丸く輝かせるJavaScript「sphere.js」
- セクシーなLightBoxを実現するJavaScript「Sexy LightBox」
- JavaScriptライブラリ「jQuery」を使ってカレンダーを作る「jCal.js」
- カバーフローぽい画像ギャラリーJavaScript「ProtoFlow」













