plain.html 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset='utf-8' />
  5. <link href='../../dist/fullcalendar.css' rel='stylesheet' />
  6. <link href='../../dist/fullcalendar.print.css' rel='stylesheet' media='print' />
  7. <script src='../../node_modules/moment/moment.js'></script>
  8. <script src='../../node_modules/jquery/dist/jquery.js'></script>
  9. <script src='../../dist/fullcalendar.js'></script>
  10. <script>
  11. $(document).ready(function() {
  12. $('#calendar').fullCalendar({
  13. header: {
  14. left: 'prev,next today',
  15. center: 'title',
  16. right: 'month,agendaWeek,agendaDay'
  17. },
  18. defaultDate: '2014-06-12',
  19. editable: true,
  20. events: [
  21. {
  22. title: 'All Day Event',
  23. start: '2014-06-01'
  24. },
  25. {
  26. title: 'Long Event',
  27. start: '2014-06-07',
  28. end: '2014-06-10'
  29. },
  30. {
  31. id: 999,
  32. title: 'Repeating Event',
  33. start: '2014-06-09T16:00:00'
  34. },
  35. {
  36. id: 999,
  37. title: 'Repeating Event',
  38. start: '2014-06-16T16:00:00'
  39. },
  40. {
  41. title: 'Meeting',
  42. start: '2014-06-12T10:30:00',
  43. end: '2014-06-12T12:30:00'
  44. },
  45. {
  46. title: 'Lunch',
  47. start: '2014-06-12T12:00:00'
  48. },
  49. {
  50. title: 'Birthday Party',
  51. start: '2014-06-13T07:00:00'
  52. },
  53. {
  54. title: 'Click for Google',
  55. url: 'http://google.com/',
  56. start: '2014-06-28'
  57. }
  58. ]
  59. });
  60. });
  61. </script>
  62. <style>
  63. body {
  64. margin: 0;
  65. padding: 0;
  66. font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
  67. font-size: 14px;
  68. }
  69. #calendar {
  70. width: 900px;
  71. margin: 40px auto;
  72. }
  73. </style>
  74. </head>
  75. <body>
  76. <div id='calendar'></div>
  77. </body>
  78. </html>