超クールなカレンダーjavascript「Calendar」

これまで多くのデートピッカーと呼ばれるカレンダーを紹介してきました。
しかし、総じて地味な外見が多かったです。
今回紹介するCalendarは超クールなカレンダーを作成できるjavascriptです。

sponsors

使用方法

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

サンプル

サンプル

sponsors

Javascriptサンプルページ一覧
skuare.net