As you see, slider labels are far away outside it's container

1 000 0002 000 0001 000 0001 250 0001 500 0001 750 0002 000 000

But you can fix it with ease if you wish, with force_edges attribute:

1 000 0002 000 0001 000 0001 250 0001 500 0001 750 0002 000 000

Grid will set up automatically, just set grid to true:

010 00002 5005 0007 50010 000

Want more? Use grid_num:

010 00002 0004 0008 000

Have predifined step? You can snap grid to it:

010 00002 0004 0006 0008 00010 000

Even if you have a very strange step!

10004.689.36

Sometimes you want to forbid dragging one or both handles. Try to move left handle, you can't.

3070

You can even lock both handles

3070

Sometimes you may want to show user full slider, but restict him from using it for 100%

010030

You can also highlight this zone:

010030

One more example with limits:

2080020406080100

You can lock your slider, by using disable option:

010030

After first focus, you can control slider by keyboard (arrow keys and WSAD):

3070

Also you can set up keyboard step (in percents):

3070

You can use native Date object if you wish, but moment.js is better!

October 18, 2024

Example with 12 hours time format

Apr 17th, 10:42 PM

Example with 24 hours time format and localisation to russian:

17-го апреля, 22:4217-го апреля, 16:4217-го апреля, 22:4218-го апреля, 04:42

One more example, with localisation to japanese:

17日 4月, 午後10時42分17日 4月, 午後4時42分17日 4月, 午後10時42分18日 4月, 午前4時42分

Set minimum interval size:

38 — 58

Set maximum interval size:

04191

Dragging interval:

3070