issue_2048.html 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  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='../lib/jquery/dist/jquery.js'></script>
  8. <script src='../lib/jquery-ui/ui/jquery-ui.js'></script>
  9. <script src='../lib/moment/moment.js'></script>
  10. <script src='../dist/fullcalendar.js'></script>
  11. <script>
  12. $(document).ready(function() {
  13. $('#calendar').fullCalendar({
  14. header: {
  15. left: 'prev,next today',
  16. center: 'title',
  17. right: 'month,agendaWeek,basicWeek,agendaDay,basicDay'
  18. },
  19. defaultView: 'agendaWeek',
  20. defaultDate: '2013-08-01',
  21. scrollTime: '00:00',
  22. editable: true,
  23. events: [
  24. {
  25. title: 'All Day Event',
  26. start: '2013-08-01'
  27. }
  28. ],
  29. eventDrop: function(event, delta, revertFunc) {
  30. if (!confirm('Move event?')) {
  31. revertFunc();
  32. }
  33. else {
  34. alert(
  35. 'delta (days/hours/minutes) is ' +
  36. Math.floor(delta.asDays()) + '/' +
  37. delta.hours() + '/' +
  38. delta.minutes()
  39. );
  40. alert('allDay is ' + event.allDay);
  41. }
  42. }
  43. });
  44. });
  45. </script>
  46. <style>
  47. body {
  48. margin-top: 40px;
  49. text-align: center;
  50. font-size: 13px;
  51. font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
  52. }
  53. #calendar {
  54. width: 900px;
  55. margin: 0 auto;
  56. }
  57. </style>
  58. </head>
  59. <body>
  60. <div id='calendar'></div>
  61. </body>
  62. </html>