Picktim
Basic JQuery timepicker plugin
Dependencies
- JQuery (>=2.2.4)
- Font-Awesome (^4.7)
Installation
Download the latest release from GitHub at https://github.com/engel-ja/picktim.
Usage
Attach the timepicker plugin to your desired document element, eg.
HTML
<head> <link rel="stylesheet" type="text/css" href="assets/css/font-awesome/css/font-awesome.css"> <link rel="stylesheet" type="text/css" href="assets/css/picktim/picktim.css"> </head> <body> ... <div class="timepicker" id="timepicker"></div> ... <script type="text/javascript" src="assets/js/jquery/jquery-2.2.4.min.js"></script> <script type="text/javascript" src="assets/js/picktim/picktim.js"></script> </body> Javascript
$(".timepicker").picktim(); Options
$(".timepicker").picktim({ backgroundColor: "#EEE", borderColor: "#DDD", textColor: "#333", symbolColor: "#333", appendTo: 'body', mode: "h24", // can be h12 for 12 hour format or h24 for 24 hour format orientation: "bottomLeft", // camel-case combination of (top/bottom and Left/Right) or (left/right and Top/Bottom) defaultValue: '00:00', // can be set as 'now' to default to current time formName: '', // specifies wether the plugin will be used as part of a form and assigns a name (leave empty for a non-form element) icons: { up: 'fa fa-chevron-up fa-fw', down: 'fa fa-chevron-down fa-fw', clear: 'fa fa-times fa-fw' } }); Useful Method(s)
$(".timepicker").picktim('value'); // returns the value of the input element in the plugin Copyright
Copyright (c) 2018 Adriaan Engelbrecht Licensed under the MIT license.
