Виджет предоставляет пользователю осуществлять ввод времени в поля форм «в два щелчка» без необходимости переключения к клавиатуре.
Виджет ориентирован на сенсорные экраны. Но и обычные экраны также поддержаны: пользователь может легко выбирать между клавиатурным вводом или использованием виджета.
Виджет аналогичен популярному jQueryUI Datepicker Widget, но предназначен для ввода полей времени.
Как использовать?
Получить код проекта на GitHub’е (каталог dist).
Подключить плагин к вашим страницам:
<link rel="stylesheet" href="timepicker-ui.css" type="text/css"/>
<script src="timepicker-ui.min.js"></script>
Связать виджет с полями вашей формы:
$('input.time').timePicker();
При вызове допустимы следующие опции:
- touchscreen — виджет работает на сенсорном дисплее (по умолчанию, используется автоопределение).
- compatible — включить ли режим совместимости со старыми браузерами (по умолчанию true)?
- defaultHour, defaultMin — время «по умолчанию» для элементов, в которых время не задано (часы и минуты соответственно). PM — послеполуденное время (+12 часов).
- onOpened — функция, вызываемая когда элемент появляется на экране.
- onClosed — функция, вызываемая когда элемент скрывается с экрана.
Пример:
$('.time').timePicker({compatible: !(Modernizr.backgroundsize && Modernizr.borderradius)});
Стибрено: http://jobject.tmweb.ru/timepicker/