Vertical slider needs to go from 0 - 100 instead of 100 - 0

Hi all!

I want to control my rollershutters with a vertical slider. However, normally the scale runs from 100 at the top to 0 at the bottom.

It would be way more intuitive to run the scale from 0 at the top to 100 at the bottom. After all, they drop from the top down.

I tried setting the MIN value to 100 and the MAX to 0 which ‘created’ the last picture but then I am unable to move the slider up or down. It just stays down.

Anyone knows a work around? I could remove the numbers and just create a rule to invert values but I would really like the numbers to be there for the WAF :crazy_face:

Thanks in advance!

This sort of works:

Make the value -100 ?

1 Like

Well, you will need a transformation if doing so. A rollershutter item status is 0 to 100, not 0 to -100 :wink:

@ubeaut this does indeed work but honestly I don’t like it when the values have a ‘-’ in front of them.

If there is no solution, I’ll use a horizontal slider instead as I think the vertical one looks odd…

Try adding vertical-reversed: true to the slider config.


Yesss! That did the job. Thanks!

How do i reverse a horizontal slider?
horizontal-reversed: does not work.

I don’t believe there’s a built in option for reversing a horizontal slider. I guess the f7 devs just didn’t think there would be much call for another other than the standard left → right numbering scheme.

1 Like