Assalamualaikum dan Salam Sejahtera..
WickedPicker adalah satu plugin yang diguna pakai untuk menghasilkan Time Picker menggunakan JQuery.
Contoh:
<html> <head> <script type="text/javascript" src="jquery-1.11.3.min.js"></script> <script type="text/javascript" src="wickedpicker.js"></script> <link href="wickedpicker.css" rel="stylesheet"> </head> <body> Time From : <input type="text" name="time-from" id="time-from"> </body> </html> <script> $(document).ready(function() { var time = new Date(), h = time.getHours(), // 0-24 format m = time.getMinutes(); time = h+':'+m; var options = { now: time , //hh:mm 24 hour format only, defaults to current time twentyFour: false, //Display 24 hour format, defaults to false upArrow: 'wickedpicker__controls__control-up', //The up arrow class selector to use, for custom CSS downArrow: 'wickedpicker__controls__control-down', //The down arrow class selector to use, for custom CSS close: 'wickedpicker__close', //The close class selector to use, for custom CSS hoverState: 'hover-state', //The hover state class to use, for custom CSS title: 'Timepicker', //The Wickedpicker's title, showSeconds: false, //Whether or not to show seconds, secondsInterval: 1, //Change interval for seconds, defaults to 1 minutesInterval: 1, //Change interval for minutes, defaults to 1 beforeShow: null, //A function to be called before the Wickedpicker is shown show: null, //A function to be called when the Wickedpicker is shown clearable: true, //Make the picker's input clearable (has clickable "x") }; $('#time-from').wickedpicker(options); }); </script>
Contoh Output:
Sekian.
******************************************
Disediakan Oleh : Haslina Shamsudin
Sistem : MedPCs Klinik
Sumber : http://ericjgagnon.github.io/wickedpicker/
******************************************
0 comments:
Post a Comment