<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <style type='text/css'> body { margin-top: 40px; text-align: center; font-size: 14px; font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif; } #calendar { width: 900px; margin: 0 auto; } </style> <link rel='stylesheet' type='text/css' href='../fullcalendar.css' /> <script type='text/javascript' src='../jquery/jquery.js'></script> <script type='text/javascript' src='../jquery/ui.core.js'></script> <script type='text/javascript' src='../jquery/ui.draggable.js'></script> <script type='text/javascript' src='../fullcalendar.js'></script> <script type='text/javascript'> $(document).ready(function() { var d = new Date(); var y = d.getFullYear(); var m = d.getMonth(); $('#calendar').fullCalendar({ draggable: true, events: [ { id: 1, title: "Long Event", start: new Date(y, m, 6, 14, 0), end: new Date(y, m, 11) }, { id: 2, title: "Repeating Event", start: new Date(y, m, 2) }, { id: 2, title: "Repeating Event", start: new Date(y, m, 9) }, { id: 3, title: "Meeting", start: new Date(y, m, 20, 9, 0) }, { id: 4, title: "Click for Facebook", start: new Date(y, m, 27, 16), end: new Date(y, m, 29), url: "http://facebook.com/" } ] }); }); </script> </head> <body> <div id='calendar'></div> </body> </html>