Need help in creating a slider bar in qualtrics that is colored- going from red to green | XM Community
Skip to main content
Solved

Need help in creating a slider bar in qualtrics that is colored- going from red to green

  • May 20, 2022
  • 2 replies
  • 73 views
S
Forum|alt.badge.img

Need help in creating a slider bar in qualtrics that is colored- going from
red to green.
If you help with custom code for that.
Which part of the javascript I add custom code?

Best answer by bgooldfed

Hi sadhnav,
Add the following to the "onLoad()" function of your question:
Qualtrics.SurveyEngine.addOnload(function()
{
///*Place your JavaScript here to run when the page loads*/
jQuery(".track").css("background", "linear-gradient(to right, red, lightgreen)")
});
Alternatively you can just add the following to your custom CSS if you want it applied to all questions:
.track {
"background": "linear-gradient(to right, red, lightgreen)"
}
If you want to customise the colour gradient, you can read all about the linear-gradient function here: https://developer.mozilla.org/en-US/docs/Web/CSS/gradient/linear-gradient
Good luck!

2 replies

bgooldfed
Level 4 ●●●●
Forum|alt.badge.img+25
  • bgooldfed
  • Level 4 ●●●●
  • Answer
  • May 23, 2022

Hi sadhnav,
Add the following to the "onLoad()" function of your question:
Qualtrics.SurveyEngine.addOnload(function()
{
///*Place your JavaScript here to run when the page loads*/
jQuery(".track").css("background", "linear-gradient(to right, red, lightgreen)")
});
Alternatively you can just add the following to your custom CSS if you want it applied to all questions:
.track {
"background": "linear-gradient(to right, red, lightgreen)"
}
If you want to customise the colour gradient, you can read all about the linear-gradient function here: https://developer.mozilla.org/en-US/docs/Web/CSS/gradient/linear-gradient
Good luck!

S
Forum|alt.badge.img
  • sadhnav
  • Author
  • May 23, 2022

Thank you for the help!!

    Terms & ConditionsAccessibility statement