Slider track changing colour as slider moves

Mar 13, 2023

Hi,

I am trying to make a slider track fill with a colour as the slider head moves along. Looking for an answer I found this. 

https://community.articulate.com/discussions/articulate-storyline/on-off-hot-spot-and-slider-color-change

Yet all that did was make me feel stupid. I looked at the example file that was attached to this thread and I just can't figure out from the file, nor from the explanation how this was done. Can anyone help?

1 Reply
Walt Hamilton

You can't fill part of the track, but fortunately this is a visual medium. That means nothing has to do what you want. It only has to look like it does it. Instead of filling part of the track, create an image for the thumb that looks like it is followed by a filled track. Make the slider twice as long as it needs to be, to accommodate the larger thumb. Then at the thumb's initial point, cover the "tail" with something that looks like the background. The tail is then hidden, but as it moves out from under the cover it appears to be filling the track behind the thumb.

In the attached sample, I made the cover a different color, so it is obvious where it is. Hide it, and the tail will appear. Set it to white or background fill, and the tail will disappear.

I also attached the thumb fill image.