Adjusting the Range Slider Pattern

Adjusting the Range Slider Pattern

  

For the range slider widget, is it possible to display the value that it is at in a container beside/above it. For example, if my range slider min value is 0 and max value is 60, I don't want to see the values populated below the slider; but instead wherever I move my slider, it would display the value that it is at in a container beside it, similar to the image attached.


Also is it possible to change the values within the range slider from integers to minutes and seconds for example


Thanks!

Jonathan Tay wrote:

For the range slider widget, is it possible to display the value that it is at in a container beside/above it. For example, if my range slider min value is 0 and max value is 60, I don't want to see the values populated below the slider; but instead wherever I move my slider, it would display the value that it is at in a container beside it, similar to the image attached.


Also is it possible to change the values within the range slider from integers to minutes and seconds for example


Thanks!

Hello Jonathan Tay,

Please find the attached oml file for customize range slider widget and also customize your range between 0 to 60.

Please refer screen shot......

 

Please let me know if you have any doubts.

Hi Amit, 


Sorry I forgot to make it clear, I'm trying to do this on mobile interface so I can't really apply the same block.

Hi Jonathan, 

the idea on mobile is the same of Amit proposed. You can open the mobilePatterns and clone the Slider. YOu just need some css skills to customize it :)


Best regards

Fabio

Fábio Fantato wrote:

Hi Jonathan, 

the idea on mobile is the same of Amit proposed. You can open the mobilePatterns and clone the Slider. YOu just need some css skills to customize it :)


Best regards

Fabio

Yes i am agree with Fábio Fantato.

Best regards

Amit Verma

Fábio Fantato wrote:

Hi Jonathan, 

the idea on mobile is the same of Amit proposed. You can open the mobilePatterns and clone the Slider. YOu just need some css skills to customize it :)


Best regards

Fabio


Hi Fabio,


Sorry, do you think you can tell me how i can clone the slider? I've tried publishing it and moving to my app but I'm not sure how to do it between a web app and a mobile app?


Thanks a lot :)


Regards,

Jonathan

Amit Verma wrote:

Jonathan Tay wrote:

For the range slider widget, is it possible to display the value that it is at in a container beside/above it. For example, if my range slider min value is 0 and max value is 60, I don't want to see the values populated below the slider; but instead wherever I move my slider, it would display the value that it is at in a container beside it, similar to the image attached.


Also is it possible to change the values within the range slider from integers to minutes and seconds for example


Thanks!

Hello Jonathan Tay,

Please find the attached oml file for customize range slider widget and also customize your range between 0 to 60.

Please refer screen shot......

 

Please let me know if you have any doubts.


Hi Amit.


I created the code on version 9 and works fine, but there is a little problem. If I use for currency, the slider never reaches the end. For example: my MaxValue is 18246.31, when I put the slider at it´s end, brings me 18245.99, never 18246.31

Any suggestions??


Regards.