If you’re frequently designing sites on Bootstrap then you should keep this Bootstrap Datepicker saved. Bootstrap DatepickerĪnyone who’s familiar with Bootstrap knows just how useful it is for new projects. This plugin is designed solely for time inputs, so it’s a nice choice if that’s all you need. Some datepicker plugins have time selection, but it comes as an extra feature. You can also run it on a 24h clock with a simple JS option. It supports user input for hours/minutes and the AM/PM setting. Wickedpicker is a jQuery-powered time selection plugin that works on any input field. While this isn’t technically a datepicker it is one of the better time pickers out there. Not to mention all the JS functions have callbacks so if you’re comfortable with coding you can add your own features into the mix. It has a few pre-designed templates, but it also comes with CSS properties that you can restyle yourself. But it’s one of the few plugins that offers gorgeous theming for calendar date selection screens. This runs on top of jQuery, so you have to consider that as well. It’s fairly lightweight considering how much you get and it measures about 7KB when minified. glDatePickerįor a detailed design and tons of optional features check out the glDatePicker plugin. This does support separate date & time inputs, but you can also combine them together making datetime selection just one click away. There’s pros & cons to everything, so I say take a peek at the plugin and see what you think. But it’s also not the typical calendar UI so it may take some adjusting from users who aren’t familiar with this interface. On the one hand, this is easier to jump around and quickly change the month/year with a few taps.
#Jquery font picker plugin plus#
The DateTimePicker plugin has its own responsive dropdown menu that lets the user select their date/time using plus & minus icons.
Here’s one of the more unique plugins out there with quite an abnormal interface. Is this better than a single date picker UI? That’s up to you(or your client) to decide.īut this is a simple plugin to setup and your visitors may prefer the single field inputs. It can also include time ranges too based on your settings and how you configure the plugin. This relies on dual input fields for selecting the starting date & ending date of a range. To use something a little simpler for range selection try Datepair.js. Plus it supports multi-month pickers, single month pickers, and pre-defined values for common date ranges(past week, past month, etc).īy far the most well-designed JS range selection plugin I’ve ever seen. It’s designed to fit into Bootstrap’s CSS stylesheet but can also be used solo. To recreate this effect try the Date Range Picker. For example Google Analytics uses their own date range picker for visitor data over a specific website. Input range pickers are extremely common with scheduling programs and visual data applications. This offers both a date and a time selection menu, so it’s a fully-featured option no matter what data you’re collecting. However, this file is pretty lightweight, and it doesn’t take much to get it working so even with jQuery you shouldn’t notice any page lags. Pickadate runs on jQuery, so you do need that library as a dependency. This is designed to be mobile-friendly and fully responsive so it’s a great solution for all devices.
Pickadate.jsĪnother choice I really like is the Pickadate.js plugin. No doubt this is one of the better date picker plugins just for its design, UX, and features. Plus you can add an optional time parameter using the 12H or 24H clock.
With Flatpickr you can customize the initial date, month, and year along with restrictions on which date(s) can be picked. But that’s often what users want: a simple interface to input data and move on. If you take a peek at the examples page you’ll notice this datepicker isn’t very complex. It’s designed with simplicity in mind so the default UI should blend into any layout. The lightweight Flatpickr plugin is easy to use and even easier to setup.
0 kommentar(er)
