Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 1,000,000+ packages pre-installed, including @kanety/jquery-ui-durationslider with all npm packages installed. Try it out:

var jqueryUiDurationslider = require("@kanety/jquery-ui-durationslider")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

@kanety/jquery-ui-durationslider v0.4.1

Bind text field and jquery-ui slider for duration input


Bind text field and jquery-ui slider for duration input.


  • jquery-ui


Install from npm:

$ npm install @kanety/jquery-ui-durationslider --save


Make a text field and div elements for sliders:

<input id="text" type="text" value="10:08" style="width: 5em;" />
<div id="hour" style="width: 150px;"></div>
<div id="minute" style="width: 150px;"></div>


  h: { elem: '#hour' },
  m: { elem: '#minute' }

If you want a slider for seconds:

  h: { elem: '#hour' },
  m: { elem: '#minute' },
  s: { elem: '#second' }

Customize max value and step value:

  h: { elem: '#hour', max: 48 },
  m: { elem: '#minute', step: 5 }

Customize duration format:

  format: 'd [DAYS]'
  • d: days
  • h: hours
  • m: minutes
  • s: seconds
  • []: raw text

Enable mousewheel support (only modern browsers):

  mousewheel: true


The library is available as open source under the terms of the MIT License.

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free