- Home
- Blog
- Web Design Fantastic, Free Calendar and Datepicker Scripts
Fantastic, Free Calendar and Datepicker Scripts
- 6 min. read
-
William CraigCEO & Co-Founder
- President of WebFX. Bill has over 25 years of experience in the Internet marketing industry specializing in SEO, UX, information architecture, marketing automation and more. William’s background in scientific computing and education from Shippensburg and MIT provided the foundation for MarketingCloudFX and other key research and development projects at WebFX.
Web applications often require a calendar or datepicker functionality. Whether it’s a web form that requests the user’s date of birth, a content management system that needs to display a calendar of events on a side column, or an application that charts data as a function of time – there’s never a short supply of demand for calendars or datepickers. To write a custom solution yourself is one option, especially if you have the time, and your requirements can’t be met by freely available scripts.
But if you’re the type that wants to save some time – check out these brilliant, free calendar and datepicker scripts available for download. You can use them for inspiration, incorporate them into your project as they are, or modify them to suit your needs.
Calendar: a Javascript class for Mootools
The Calendar class for mootools is a script that plugs into the mootools framework, providing you with an accessible, unobtrusive datepicker for your web forms. The Calendar class gives you three navigation options: navigate by month, navigate by month or year, and static/no navigation.
It supports multi-lingual and fancy date formatting features, and also allows you to restrict the range of available dates that the user can select. The script weighs at about 15KB compressed with the YUI compressor, but you can download the uncompressed version with the developer’s comments if you want to modify it or understand how it works.
MooMonth
MooMonth is a full calendar application with smooth animation effects and is highly-customizable to your web application’s needs. Clicking on certain areas such as the day or event expands (or collapses) the area to focus on the particular date.
It’s still in the alpha phase, but brief testing under Firefox 2, IE 7, and Safari 3 indicates that the current version works as intended. MooMonth Demo
Monket Calendar
Monket Calendar is a robust, Ajax-enabled calendar that uses PHP for its dynamic features. Several things such as drag-and-drop events, ability to create multi-day events, and its iCal-style interface makes Monket Calendar a promising option for providing task and events capabilities to your web applications.
Monket calendar requires PHP 4 and up, as well as Apache with RewriteRules enabled to work. Additionally, it’s still in beta phase so there may be some cross-browser issues with the current Beta 0.9.1 release. Monket Calendar demo
Datejs
Datejs is a simple yet elegant date library.
The user inputs date queries such as “today“, “+5years“, “6/4/2005” and Datejs attempts to match it with relevant date results. Datejs can be used in an assortment of ways and is limited only by the developer’s imagination – from auto-suggesting/auto-filling web forms to searching a database of dates for relevant results based on contextual searches. Though still in its alpha release, the author states that “Datejs has passed all trials and is ready to strike”.
Swazz Javascript Calendar
Swazz Javascript Calendar is a simple, lightweight JavaScript datepicker widget for use in form fields.
It’s been tested for compatibility in IE6 and 7, Firefox 1.5 and 2.0, and Safari. It requires no additional JavaScript framework/library, thus making it a top-notch solution for those concerned about page weigh and bloat (it’s about 6KB).
jQuery UI Datepicker
jQuery UI Datepicker is a plugin written on top of the jQuery library and has an innumerable amount of features, configurations, and uses. It provides keystroke functionalities for keyboard-driven navigation and control, localization for a wide selection of languages – and with jQuery included – the developer has access to a robust library for custom modification of its default options.
Calendar Slide Select
Prototype JavaScript framework.
JavaScript Calendar Component
Calendar Component, developed by NoGray (a web design and development firm) is a customizable calendar that uses mootools.
The Calendar Component allows you to specify special events and holidays, select multiple dates, and translate data into different languages using Google translation. The provided external stylesheet file allows you to skin the theme of your calendars quite easily.
Vista-like Ajax Calendar
The Vista-like Ajax Calendar is inspired by the Windows Vista task bar calendar. It employs mootools and PHP to give the user a simple-to-use calendar that has transition effects and speedy navigation between months, years, or decades.
The Vista-like calendar is licensed under the Creative Commons Attribution-NonCommercial license which allows you to freely use the script for non-commercial purposes as long as the author is given proper credit for the work. Vista-like Ajax Calendar demo
Unobtrusive Date-Picker Widget
The Unobtrusive Date-Picker Widget is an accessible script packed with terrific features. It has full keyboard control options, support for multiple date formats, disabling of certain dates, and “smart” localization which tries to automatically guess which language the user prefers.
It currently supports 16 languages including English, Spanish, French, and Hebrew. If the language you prefer isn’t available, you can quickly create a language file using the template provided. Unobtrusive Date-Picker Widget demo If you liked this post, you may also be interested in the following articles:
-
President of WebFX. Bill has over 25 years of experience in the Internet marketing industry specializing in SEO, UX, information architecture, marketing automation and more. William’s background in scientific computing and education from Shippensburg and MIT provided the foundation for MarketingCloudFX and other key research and development projects at WebFX.
-
WebFX is a full-service marketing agency with 1,100+ client reviews and a 4.9-star rating on Clutch! Find out how our expert team and revenue-accelerating tech can drive results for you! Learn more
Make estimating web design costs easy
Website design costs can be tricky to nail down. Get an instant estimate for a custom web design with our free website design cost calculator!
Try Our Free Web Design Cost CalculatorWeb Design Calculator
Use our free tool to get a free, instant quote in under 60 seconds.
View Web Design CalculatorMake estimating web design costs easy
Website design costs can be tricky to nail down. Get an instant estimate for a custom web design with our free website design cost calculator!
Try Our Free Web Design Cost Calculator