FullCalendar Debugging Template

by sebababi

HTML

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/1.6.3/fullcalendar.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/1.6.3/fullcalendar.min.js"></script>
<div id='calendar'></div>

CSS

body {
	margin-top: 40px;
	text-align: center;
	font-size: 13px;
	font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}

#calendar {
	width: 900px;
	margin: 0 auto;
}

JavaScript

$('#calendar').fullCalendar({
	header: {
		left: 'prev,next today',
		center: 'title',
		right: 'month,agendaWeek,agendaDay'
	},
	editable: true,
    year: 2013,
    month: 7, // August
	events: [
		{
			title: 'All Day Event',
			start: '2013-08-01'
		},
		{
			title: 'Long Event',
			start: '2013-08-05',
            end: '2013-08-09'
		},
		{
			id: 999,
			title: 'Repeating Event',
			start: '2013-08-13',
			allDay: false
		},
		{
			id: 999,
			title: 'Repeating Event',
			start: '2013-08-20',
			allDay: false
		},
		{
			title: 'Click for Google',
			start: '2013-08-15',
			url: 'http://google.com/'
		}
	]
});