mooTimePicker

mooTimePicker

Released 7 years ago , Last update 7 years ago

mooTimePicker is a library that will allow you to have a time picker widget, that uses sliders to select the hours, minutes and seconds.

What's mooTimePicker?

mooTimePicker is a library that will allow you to have a time picker widget, that uses sliders to select the hours, minutes and seconds.

How to use it?

You'll need a few thing to use it. First of all the mootools Core library and the MooTools More Slider library
both files are included in the download, along with the mooTimePicker (and the minified version of mooTimePicker) files.
You need to include the 3 files in betweend the and of your html code. and don't forget the style sheet.
then just add to your domready event, the call to mooltiSelect, something like:

window.addEvent('domready', function(){  
new mooTimePicker(input,[options]);  
});  

Which Properties you can pass to mooTimePicker, and which are the default values?

This are the available options:

secondsSliders: false,  
hoursSteps: '1',  
minuteSteps: '10',  
secsSteps: '30',  
hourLabel: 'Hours',  
minsLabel: 'Minutes',  
secsLabel: 'Seconds',  
labelsPosition: 'top',  
alwaysOn: false,  
showLabels: false,  
injectInside: ''  

secondsSliders Enables/disables the seconds slider. Defaults to False
hoursSteps If a number is passed, sets the amount of hours each step will increase. If an array, object, or a string with comma separated values is passed, the length will be the steps. Defaults to 1.
minuteSteps If a number is passed, sets the amount of minutes each step will increase. If an array, object, or a string with comma separated values is passed, the length will be the steps. Defaults to 10.
secsSteps If a number is passed, sets the amount of seconds each step will increase. If an array, object, or a string with comma separated values is passed, the length will be the steps.Defaults to 30.
hourLabel Label to be placed on top or bottom of the Hours Sliders. Defaults to Hours.
minsLabel Label to be placed on top or bottom of the Minutes Sliders. Defaults to Minutes.
secsLabel Label to be placed on top or bottom of the Seconds Sliders. Defaults to Seconds.
labelsPosition Sets the position where the labels will be shown, accepts 'top' or 'bottom�. Defaults to top.
alwaysOn Sets in the sliders are always on, of fade in on focus of the input element. Defaults to False.
showLabels Sets in the labels are always displayed. Defaults to True.
injectInside The element, or id of the element, where the eliders will be placed, if blank, the input parent element will be used. Defaults to ''.

Which MooTools version is it compatible with?

Right now, it's fully compatible with MooTools 1.3.0, I'm working with the backward compatibility

Pricing

14 day 14-day money-back guarantee

FREE

MIT license

The MIT license is an open-source license.

License » MIT license Download

Get A Quote

What do you need?
  • Custom development
  • Integration
  • Customization / Reskinning
  • Consultation
When do you need it?
  • Soon
  • Next week
  • Next month
  • Anytime

Thanks for getting in touch!

Your quote details have been received and we'll get back to you soon.


Or enter your name and Email
No comments have been posted yet.