There are tons of jQuery plugins that offer date-time functionality. Some of these plugins are more developed than others and each one has its unique benefits. It is important to note that no plugin should be seen as ideal since every project is subjective and need its solution. In choosing a great plugin, you should check for balanced documentation, broad compatibility, easy and open customization, and practical UX. Below are some top-notch free calendar and date-picker jQuery plugins:
Timeline calendar
It’s brilliant because it can be styled and scaled easily to fit any website. Also, it’s compatible with all screen sizes and has a dynamic event viewer with specific dates and details. The dates for each event are either underlined or highlighted.
[button-red url=”http:/codecanyon.net/item/timeline-calendar/49550?ref=imTaimur” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
FullCalendar
External data might be pulled through JSON/AJAX. This plugin has optional multi-language settings and has a different way of highlighting regular and special intervals. Furthermore, it runs on top of Bootstrap with traditional CSS classes.
[button-red url=”http:/arshaw.com/fullcalendar/” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
Create astonishing iCal-like calendars with jQuery
This is the most convenient jQuery Mobile full-screen calendar and it has customizable content and theme for calendar events. jQM Calendar is lightweight and its JS+CSS files come out to 14kb.
[button-red url=”http:/stefanoverna.com/blog/2009/01/create-astonishing-ical-like-calendars-with-jquery.html” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
jQuery Date Range Picker
Here, you have a 7kb compressed with lots of custom options and setup details on special events or days. Also, it has navigation limits to certain weeks or months and it has a colorful user-interface with easy navigation.
[button-red url=”http:/codecanyon.net/item/jquery-date-range-picker/261519?ref=imTaimur” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
Date Range Picker using jQuery
It offers various formats for selecting dates and times. Consequently, it needs only a line of JS code to operate.
[button-red url=”http:/www.filamentgroup.com/lab/date_range_picker_using_jquery_ui_16_and_jquery_ui_css_framework/” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
jQuery UI Datepicker Project
[button-red url=”http:/marcgrabanski.com/articles/jquery-ui-datepicker” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
jMonthCalendar
[button-red url=”http:/www.bytecyclist.com/projects/jmonthcalendar/” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
Calendar A Javascript class for Mootools
[button-red url=”http:/www.electricprism.com/aeron/calendar/” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
JavaScript Calendar
[button-red url=”http:/nogray.com/calendar.phpv” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
Monket Calendar
[button-red url=”http:/monket.net/wiki-v2/Monket_Calendar” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
JSCalendar
[button-red url=”http:/codecanyon.net/item/jscalendar/67528?ref=imTaimur” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
Simple jQuery date-picker plugin
[button-red url=”http:/teddevito.com/demos/calendar.php” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
MagiCalender
[button-red url=”http:/codecanyon.net/item/magicalender/97898?ref=imTaimur” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]
jQuery date picker plug-in
[button-red url=”http:/www.kelvinluck.com/assets/jquery/datePicker/v2/demo/” target=”_blank” rel=”nofollow external noopener noreferrer” position=”left”]View[/button-red]