Control, TrackBar but with two sliders

    It took such a “thing” as TrackBar with only two sliders, I did not find a ready-made solution in jQuery, I decided to write it myself, though not in jQuery, but in pure JS. It seems that this did not get worse. This "piece" was needed to select the numerical values ​​in the forms of the information kiosk .

    As you can see, the device does not have a keyboard, and indeed a touchscreen - the thing is not very convenient, so you had to make the “thing” very convenient, so that clicking anywhere, and not just on the sliders themselves, was perceived as a desire to drag the sliders. In addition, during the testing process, it turned out that users still strive to push beyond the control when the slider is in the extreme position. I had to finish working, make margins at the edges, accessible for pressing but not for moving the slider, something like this:

    As you know, the “thing” can be used not only in information kiosks, but also in any other places where you need to specify values from and to.

    You can set the minimum distance by which the sliders are suitable, the number to which the values ​​will be rounded (necessary for larger numbers, for example prices), allow or not allow the sliders to move to positions that do not lead to a change in values.

    The script itself is here .

    A usage example can be viewed here or downloaded from here .

    Also popular now: