Change Color of Slider Bar from Gray to Color Gradient

Question

Hello,I am trying to change the background color of the slider bar (Draggable Sliders) to a color gradient going from red to yellow to green. I found the following post  which addresses my question and used the following custom css from that link:  .Skin .horizontalbar .Slider .track {     background-image: linear-gradient(-90deg,red,yellow,green); }Once the css has been added the slider bars disappear (see included image) instead of the intended color gradient.I also tried the following javascript but had similar results.var that=this.questionId;    jQuery(".track:eq(0)").css({ "background-image":"linear-gradient(-90deg,red,yellow,green)"});Does anyone know why this might be happening and how to rectify the issue?

rondev · Accepted Answer

Paste the below code in the slider question, add javascript Onready function:jQuery(".track:eq(0)").css({ "background-image":"linear-gradient(-90deg,green,yellow,red)"});Output:

SJ_UofA · Answer

rondev Thanks for the fast reply this code worked! I also realized I was in a static theme which was overriding this code initially but once switched to dynamic theme things went smoothly.

Sign up

Login to the Community