summaryrefslogtreecommitdiff
path: root/public/js/fullcalendar/examples/multimonth-view.html
diff options
context:
space:
mode:
Diffstat (limited to 'public/js/fullcalendar/examples/multimonth-view.html')
-rw-r--r--public/js/fullcalendar/examples/multimonth-view.html110
1 files changed, 110 insertions, 0 deletions
diff --git a/public/js/fullcalendar/examples/multimonth-view.html b/public/js/fullcalendar/examples/multimonth-view.html
new file mode 100644
index 0000000..feb9d23
--- /dev/null
+++ b/public/js/fullcalendar/examples/multimonth-view.html
@@ -0,0 +1,110 @@
1<!DOCTYPE html>
2<html>
3<head>
4<meta charset='utf-8' />
5<script src='../dist/index.global.js'></script>
6<script>
7
8 document.addEventListener('DOMContentLoaded', function() {
9 var calendarEl = document.getElementById('calendar');
10
11 var calendar = new FullCalendar.Calendar(calendarEl, {
12 headerToolbar: {
13 left: 'prev,next today',
14 center: 'title',
15 right: 'multiMonthYear,dayGridMonth,timeGridWeek'
16 },
17 initialView: 'multiMonthYear',
18 initialDate: '2023-01-12',
19 editable: true,
20 selectable: true,
21 dayMaxEvents: true, // allow "more" link when too many events
22 // multiMonthMaxColumns: 1, // guarantee single column
23 // showNonCurrentDates: true,
24 // fixedWeekCount: false,
25 // businessHours: true,
26 // weekends: false,
27 events: [
28 {
29 title: 'All Day Event',
30 start: '2023-01-01'
31 },
32 {
33 title: 'Long Event',
34 start: '2023-01-07',
35 end: '2023-01-10'
36 },
37 {
38 groupId: 999,
39 title: 'Repeating Event',
40 start: '2023-01-09T16:00:00'
41 },
42 {
43 groupId: 999,
44 title: 'Repeating Event',
45 start: '2023-01-16T16:00:00'
46 },
47 {
48 title: 'Conference',
49 start: '2023-01-11',
50 end: '2023-01-13'
51 },
52 {
53 title: 'Meeting',
54 start: '2023-01-12T10:30:00',
55 end: '2023-01-12T12:30:00'
56 },
57 {
58 title: 'Lunch',
59 start: '2023-01-12T12:00:00'
60 },
61 {
62 title: 'Meeting',
63 start: '2023-01-12T14:30:00'
64 },
65 {
66 title: 'Happy Hour',
67 start: '2023-01-12T17:30:00'
68 },
69 {
70 title: 'Dinner',
71 start: '2023-01-12T20:00:00'
72 },
73 {
74 title: 'Birthday Party',
75 start: '2023-01-13T07:00:00'
76 },
77 {
78 title: 'Click for Google',
79 url: 'http://google.com/',
80 start: '2023-01-28'
81 }
82 ]
83 });
84
85 calendar.render();
86 });
87
88</script>
89<style>
90
91 body {
92 margin: 40px 10px;
93 padding: 0;
94 font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
95 font-size: 14px;
96 }
97
98 #calendar {
99 max-width: 1200px;
100 margin: 0 auto;
101 }
102
103</style>
104</head>
105<body>
106
107 <div id='calendar'></div>
108
109</body>
110</html>