The code, unfortunately, I can not attach.

There is an implementation of the slider, which moves when a person's age changes. The length of the block that the 166px slider moves. The minimum age is 16 years, the maximum is 80. That is =>

0px = 16 лет 166px = 80 лет 

I had a problem with drawing up a formula that will calculate age, depending on the location of the slider, for example,

 33 px = x лет 

Tell me where to go to make the right formula?

I tried this:

 80 лет = 166px x лет = 33px => x = (80 * 33) / 166 

As a result, this is almost the right decision, but there is a minus, 1px != 16

  • one
    apparently, 16 years should not be at 1px but at 0px - this is the starting point and minimum. So why put it on 1px? It turns out that the длина_ползунка / (max_лет - min_лет) .... but there you will have to indulge with rounding ..... in the end, 0px - 16 years, 2,6px - 17 years, 5,2px - 18 years, etc. ..... okrulenie will need to be because no decimal - Alexey Shimansky
  • @ Alexey Shimansky, yes, that's right, the count should go from 0. Thanks, I'll try now. - Amandi
  • In general, in order not to suffer with the calculation of pixels, you can take <input type="range" , set a minimum, maximum, step. and just stylize it) - Alexey Shimansky
  • Pixels are easy to calculate, it is difficult to calculate the year by pixels) When moving the slider, pixels change from 1 to 166 and then, by pixels, determine the age) range does not work here, since two sliders are used, between which the age gap is Amandi
  • Just the most it. Because the range is exactly known on what scale is what value. that is, if we have a minimum of 16 and a maximum of 80 and a step, for example, 4, then this is what is written <input type="range" min="16" max="80" step="4"/> . Everything .... further, at the onchange event, the onchange simply recalculated ..... maybe I don’t quite understand what the используются два ползунка, между которыми промежуток возраста . But while I do not see any problems with this. I see the opposite, only pluses)) codepen.io/gearmobile/pen/beVNqj ..... especially the slider can be put in through css length 166px and not sweating .... - Alexey Shimansky

1 answer 1

The length in pixels is 166 = the number of years (80 - 16 = 64), i.e. 166 = 64 .

It turns out, in pixels 1 year = 2,59375

The final formula should be like this: лет = (текущее_положение_ползунка / 2,59375) + 16

  • This is static. Here, the pixels change when the slider is moved, i.e. from 1 to 166 it can stop, for example, by 134px, and by these pixels (134) you can determine the age - Amandi
  • I do not understand, so what? Substitute 134 in the formula - it will be 67 years old, what's wrong? - Maxim Stepanov
  • one
    aaa, I understood, yes soror, there’sn’t the length of the slider, but the current position of the slider naturally .. - Maxim Stepanov
  • Tell me how to get back from the age of the pixels? - Amandi
  • one
    @Amandi (age - 16) * 2,59375 - Maxim Stepanov