timepicker.js | Creating a Clock to Pick Time with JavaScript

timepicker.js a javascript time picker library, it will create a clock on web page, we can pick a time by dragging the hour & minute hands.

How to pick a time using timepicker.js?

1.Import timepicker.js in html page

<script src="timepicker.js"></script>

2.Use Timepicker() function to create a analog clock

where:

• isClockMode: is clock mode?
• is24HoursSystem: uses 24-hour clock or not?
• hour/minute/second: uses current local time if undefined

Timepicker(isClockMode, is24HoursSystem, hour, minute, second)

We also can use other API methods to control this analog clock and get time.

// toggles clock mode
changeClockMode()
// toggles between 24-hour and 12-hour clock
changeHourSystem()
// destroys the clock
destroy()
// returns the clock element
getElement()
// returns the selected hours
getHours()
// returns the selected minutes
getMinutes()
// returns the selected time string
getTimeString()
// shows the clock
hide()
// hides the clock
hide()
// checks if is 24-hour clock
is24HoursSystem()
// checks if is clock mode
isClockMode()
// checks if is hidden
isHidden()
// sets styles
setDisplayStyle(style)
// sets time
setHours(hours)
setMinutes(minutes)
setSeconds(seconds)