timedropper jquery ui timepicker example

HTML

<!DOCTYPE html>
<html>
<head>
    <title>timedropper jQuery UI</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-3.6.0.slim.min.js"></script>
    <script src="/assets/js/timedropper-jquery.js"></script>
</head>
<body>
    <div class="m-5">
        <h1 class="lead">timedropper jQuery UI</h1>
        <input type="text" id="time-dropper">
    </div>
</body>
</html>

CSS

Javascript

$('#time-dropper').timeDropper();
$('#time-dropper').click();