I have also seen this post in the community which comes very close to a usable solution. Here, I can add HTML to each specific question (I don't want the code to apply to all questions in the survey because some end points are just 1 and not 1,000 or 100,000): <style>ul.numbers li::after { content:",000"; }</style> <style> ul.numbers li:nth-child(1):after { content:""; } </style> However, this seems to add a space after the number before appending it with the added content after. So, is there a way to remove the space so the number appears as: "1,000" rather than: "1 ,000" ? !
@npetrov937 Thanks for the quick response. even in the addOnLoad function, this code does not work for the slider Bar style question. However, I should clarify a couple of things: 1) I would like this to apply to the "bars" slider type not the "sliders" type. Does this matter? 2) I'd like the color to change _up to where the bar has been moved_ rather than the entire bar. I think my original post may have made this unclear. Here is a link to a preview of two questions providing an example. The first question is attempting the new code. The second question shows a very close attempt. The only difference between the second question and my goal is to change the "gradient" color to be solid that changes at different values of the sliding question.
@npetrov937 npetrov937 > @npetrov937 said: > There we go: > > function getTheColor( colorVal ) { > var theColor = ""; > if ( colorVal < 50 ) { > myRed = 255; > myBlue = parseInt( ( ( colorVal * 2 ) * 255 ) / 100 ); > } > else { > myRed = parseInt( ( ( 100 - colorVal ) * 2 ) * 255 / 100 ); > myBlue = 255; > } > theColor = "rgb(" + myRed + ",0" + "," + myBlue + ")"; > return( theColor ); > } > > jQuery("input[type = hidden]").change(function () { > sliderScore = parseInt(jQuery("#QID1 input.ResultsInput").eq(0).val()) > colorSlider = getTheColor(sliderScore) > jQuery(".track:eq(0)").css({ "background-color":colorSlider}); > }); > For some reason, this code does not work for me when I preview the question. I've added the code to the `Qualtrics.SurveyEngine.addOnReady(function()` area
I should note that I have almost no experience with Java or coding other than in R. However, I found a way to get the bar to change in a way that _is close_ to what I desire. If I use the code: `var bar = document.querySelectorAll('.bar'); for (var i=0; i < bar.length; i++) { bar[i].setAttribute("style", "background-image:linear-gradient(-90deg,red,blue)"); }` I see the slider change from blue to red as I slide across. However, the if I slide all the way to the right I still see blue on the left. I would like the entire bar to change color as the value of the slider bar question increases. For example, sliding to a value of 25 would be blue, sliding to 50 would make the entire bar a redish-blue, and sliding to 100 would make the entire bar red.
Already have an account? Login
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.
Sorry, we're still checking this file's contents to make sure it's safe to download. Please try again in a few minutes.
Sorry, our virus scanner detected that this file isn't safe to download.
