gcal.html 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  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. #loading {
  12. position: absolute;
  13. top: 5px;
  14. right: 5px;
  15. }
  16. #calendar {
  17. width: 900px;
  18. margin: 0 auto;
  19. }
  20. </style>
  21. <link rel='stylesheet' type='text/css' href='../fullcalendar/fullcalendar.css' />
  22. <script type='text/javascript' src='../jquery/jquery.js'></script>
  23. <script type='text/javascript' src='../fullcalendar/fullcalendar.js'></script>
  24. <script type='text/javascript' src='../fullcalendar/gcal.js'></script>
  25. <script type='text/javascript'>
  26. $(document).ready(function() {
  27. $('#calendar').fullCalendar({
  28. // US Holidays
  29. events: $.fullCalendar.gcalFeed(
  30. 'http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic',
  31. {draggable: false, className: 'mygcal'}
  32. ),
  33. eventClick: function(event) {
  34. window.open(event.url, 'gcalevent', 'width=700,height=600');
  35. return false;
  36. },
  37. loading: function(bool) {
  38. if (bool) $('#loading').show();
  39. else $('#loading').hide();
  40. }
  41. });
  42. });
  43. </script>
  44. </head>
  45. <body>
  46. <div id='loading' style='display:none'>loading...</div>
  47. <div id='calendar'></div>
  48. </body>
  49. </html>