Complicated slider

I am trying to create a slider that grows like this:

slider

At first I started making a logarithmic slider, but actually did not match the required shortcuts. I can’t figure out how to achieve this. Any ideas?

The difficulty lies in the fact that as you move the slider, the increment changes: 5 β†’ 10, 10 β†’ 100, 500 β†’ 1000, etc.

Here is the slider daemon you can play with: http://jsfiddle.net/jdefcswv/2/

Thanks!

(for some reason SO wants me to put the code here)

<html></html> 
+5
source share
1 answer

I am adding a Converter function. They use the value of the slider as global progress and determine between which steps you want to calculate the value. You add the step addStep(progress, stepValue) , progress should be a positive value.

Currently, the progress between the two steps is linear, but a good start ^^.

http://jsfiddle.net/jdefcswv/3/

+2
source

Source: https://habr.com/ru/post/1233262/


All Articles