JavaScriptライブラリ「jQuery」でカレンダーを作る「FullCalendar」

JavaScriptライブラリの「jQuery」を使用してカレンダーを作ります。
via：FullCalendar - Full-sized Calendar jQuery Plugin

使用方法

FullCalendar - Full-sized Calendar jQuery Pluginからファイル一式をダウンロードします。


<link rel="stylesheet" href="fullcalendar.css" media="all">
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="ui.core2.js"></script>
<script type="text/javascript" src="ui.draggable.js"></script>
<script type="text/javascript" src="fullcalendar.js"></script>
<script>
$(document).ready(function() {
	$('#id名').fullCalendar();
});
</script>

あとはid名を表示させたい場所に記述すれば完成です。
また、イベントは以下のように書きこむことで表示されます。


events: [
	{
		id: 1, //イベントID
		title: "skuare.net", //タイトル
		start: "2009-09-05", //始まり
		end: "2009-09-10" //終わり（省略可）
		url: "http://www.skuare.net" //リンク先
}

サンプル

Javascriptサンプルページ一覧

skuare.net