HTML - Custom Input With Minutes And Seconds

I'm trying to make an HTML input, where I can input up to 100 minutes and 59 seconds. The input should be like the time input. Is there somebody with an idea what i can do?

Solution 1:

Either you do some javascripting or start to use a framework. Not jquery can support you in doing that, but here are some jquery examples to start with: http://www.sitepoint.com/10-jquery-time-picker-plugins/

Solution 2:

Maybe you could code the interface and interactivity yourself, since that feature doesn't yet seem to be implemented in browsers (from what Jukka K. Korpela has explained). I can try to help with the code if you are interested. Please post a comment showing your interest if you'd like me to help.

Solution 3:

The HTML way of doing this is to use <input type=time> with a max attribute. Assuming the desired minimum is zero, here’s the code:

<input id=foo name=foo type=time min="0:00" max="100:59">

Browser support is still limited to WebKit browsers. The markup degrades gracefully to a simple text input field in other browsers, but you may wish to add JavaScript code to check the syntax of input in that case.