How to show values below the slider and modifying the tick color in the dynamic selection bar color?

[sukanya-pai]

I have the following requirements:

1. Showing the values below the slider.
2. Making the tick color to white in the slider with the slider dynamic selected bar color of for example blue.

Description of requirement/issue:

1. In the slider link, there is a section with the heading "Range slider with ticks and values at intermediate positions". There we can see that the values are below the slider. But in all other places, the values are above the slider. Attaching screenshot for the reference:

Can you please tell how are the values displayed below the slider? I couldn't find any difference in the code for the values shown above and below the slider.

2. I need to make the tick color as white in the already selected bar. Is there any way? I see that there is a function getTickColor. But it changes the tick color in the not selected area.

Here is the JSFiddle which describes my issues.

Please help. I need the solutions urgently for our project.

[sukanya-pai]

Fixed both the issues By modifying the css styles in rzslider.css file. Closing this issue.