Press "Enter" to skip to content

Convert HTML Input Box to Duration Picker | html-duration-picker.js

HTML-duration-picker.js is a very small JS library used to convert the original HTML text input into a duration picker and the chooser to feel that it is as original as possible.

How to make use of it:

1. Download and include the HTML-duration-picker.js on the webpage.

<script src="dist/html-duration-picker.min.js"></script>

2. Add the HTML-duration-picker attribute to the input field and the plugin will maintain the remainder.

<input type="text" class="html-duration-picker" />

3. Set the initial period.

<input type="text" class="html-duration-picker" data-duration="00:32:10" />

4. Set the min/max duration.

<input type="text" class="html-duration-picker" data-duration-max="01:00:00" />
<input type="text" class="html-duration-picker" data-duration-min="00:00:10" />

5. Hide the second slot.

<input type="text" class="html-duration-picker" data-hide-seconds />

Easy Duration Picker, HTML Duration Picker Plugin/Github

Read More  A Simple and Easy jQuery Date and Time Picker | jSunPicker

See Demo And Download

Official Website(nadchif): Click Here

This superior jQuery/javascript plugin is developed by nadchif. For extra Advanced Usages, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published. Required fields are marked *