Minimalist Calendar Plugin For jQuery - Calendar.js
| File Size: | 4.32 KB |
|---|---|
| Views Total: | 3041 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
The Calendar.js jQuery plugin makes it easier to embed a simple calendar widget into the webpage. The plugin provides a function that resets any previously stored data and reinitializes the calendar from scratch. Accepts a single month as argument. Only constructs the calendar for the current year.
How to use it:
1. Insert the latest jQuery JavaScript library and the calendar plugin's files into the html file.
<link rel="stylesheet" href="calendar.css">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous">
</script>
<script src="calendar.js"></script>
2. Create the html for the calendar widget.
<table id="calendar">
<tr id="monthrow">
<th colspan="7">
<button id="prev" onclick="prevMonth()">❮</button>
<span id="month"></span>
<button id="next" onclick="nextMonth()">❯</button>
</th>
</tr>
<tr class="daysoftheweek">
<th>Sun</th>
<th>Mon</th>
<th>Tue</th>
<th>Wed</th>
<th>Thu</th>
<th>Fri</th>
<th>Sat</th>
</tr>
</table>
3. That's it. To override the default month names, follow this step:
let monthNames = [
"January",
"February",
"March",
"April",
"May",
"June",
"July",
"August",
"September",
"October",
"November",
"December"
];
This awesome jQuery plugin is developed by initforcode. For more Advanced Usages, please check the demo page or visit the official website.











