jessicabrady16-html-duration-picker
v2.2.24TypeScript
Turn an html input box to a duration picker, without jQuery
10/weekUpdated 3 years agoApache-2.0Unpacked: 36.8 KB
Published by Chif
npm install jessicabrady16-html-duration-pickerHTML Duration Picker: "data-hide-hours" Edition
=========
!npm
!Push Basic Tests
jessicabrady16-html-duration-picker.js is fork of html-duration-picker.js, which is a very tiny JS library used for transforming a native HTML text input into a duration picker. The aim is for the picker to feel like a native element as much as possible.
This fork has a data-hide-hours feature as an attribute for the HTML tags in addition to the data-hide-seconds that already existed.
Here is an example with the data-hide-hours attribute:
``html
``
data-hide-hours
type="text"
class="html-duration-picker"
data-duration-max="00:15:00"
data-duration-min="00:00:00"
data-duration="00:08:03"
aria-label="Time"
/>
!Picker Input With Data-Hide-Hours
Without the data-hide-hours attribute:
!Duration Picker Input
Why use html-duration-picker?
* Tiny (~7kb)
* No additional dependencies (CSS, jQuery, etc)
* Bootstrap 3 and Bootstrap 4 Compatible
* Angular Compatible
* You can modify and improve it :-)
* Absolutely FREE!
License
Apache-2.0
Contributions
Contributions and suggestions are very welcome and wanted. I try to respond to pull requests within 48 hours. For more information see CONTRIBUTING.md.
Documentation
See DOCUMENTATION.md for instructions on how to install and use it in your project.
Contributors ✨
Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!