basic.html 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html>
  3. <head>
  4. <style type='text/css'>
  5. body {
  6. margin-top: 40px;
  7. text-align: center;
  8. font-size: 14px;
  9. font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
  10. }
  11. #calendar {
  12. width: 900px;
  13. margin: 0 auto;
  14. }
  15. </style>
  16. <link rel='stylesheet' type='text/css' href='../fullcalendar.css' />
  17. <script type='text/javascript' src='../jquery/jquery.js'></script>
  18. <script type='text/javascript' src='../jquery/ui.core.js'></script>
  19. <script type='text/javascript' src='../jquery/ui.draggable.js'></script>
  20. <script type='text/javascript' src='../fullcalendar.js'></script>
  21. <script type='text/javascript'>
  22. $(document).ready(function() {
  23. var d = new Date();
  24. var y = d.getFullYear();
  25. var m = d.getMonth();
  26. $('#calendar').fullCalendar({
  27. draggable: true,
  28. events: [
  29. {
  30. id: 1,
  31. title: "Long Event",
  32. start: new Date(y, m, 6, 14, 0),
  33. end: new Date(y, m, 11)
  34. },
  35. {
  36. id: 2,
  37. title: "Repeating Event",
  38. start: new Date(y, m, 2)
  39. },
  40. {
  41. id: 2,
  42. title: "Repeating Event",
  43. start: new Date(y, m, 9)
  44. },
  45. {
  46. id: 3,
  47. title: "Meeting",
  48. start: new Date(y, m, 20, 9, 0)
  49. },
  50. {
  51. id: 4,
  52. title: "Click for Facebook",
  53. start: new Date(y, m, 27, 16),
  54. end: new Date(y, m, 29),
  55. url: "http://facebook.com/"
  56. }
  57. ]
  58. });
  59. });
  60. </script>
  61. </head>
  62. <body>
  63. <div id='calendar'></div>
  64. </body>
  65. </html>