Basic Year Calendar Generator With jQuery - full-year-calendar.js
| File Size: | 5.09 KB |
|---|---|
| Views Total: | 9724 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
full-year-calendar.js is a really simple jQuery plugin used for generating a year calendar where you can specify start/end months and add custom events/holidays. Requires the moment.js library to handle dates and times.
How to use it:
1. Insert the needed jQuery library and moment.js into the html page.
<script src="/path/to/jquery.min.js"></script> <script src="/path/to/moment.min.js"></script>
2. Download and insert the full-year-calendar.js script after jQuery.
<script src="full-year-calendar.js"></script>
3. Create a placeholder element for the year calendar.
<div id="full-year-calendar"></div>
4. The JavaScript to create a basic year calendar on the web page.
let fyc = $('#full-year-calendar').fullYearCalendar();
5. Customize the start/end dates.
let fyc = $('#full-year-calendar').fullYearCalendar({
yearStart: new Date('2018-06-01'),
yearEnd : new Date('2019-06-01')
});
6. Set the initial events and holidays.
let fyc = $('#full-year-calendar').fullYearCalendar({
weekDaysHolidays: [0, 1],
publicHolidays: ['2018-05-25', '2018-08-15'],
niwds: ['2018-05-26'],
halfDays: ['2018-05-27'],
noSchools : ['2018-11-22']
});
7. Add a custom holiday to the year calendar.
fyc.addHoliday({
type: 'niwds',
from:'2018-05-05'
});
This awesome jQuery plugin is developed by MaheshH. For more Advanced Usages, please check the demo page or visit the official website.











