I want to create a survey item of the Highlight question type in which only a few words in the sentence will require a response. For example, in the sentence...
Once upon a time there was a young foo who barred / bart his way out of many pickles.
...I only want to receive responses for barred and bart. Specifically, I want respondents to indicate which of the words is most correct, and whether the remaining word is possible or impossible. My problem is that the built-in interface does not indicate which words can be clicked (unless you mouse-over, in which case the background-color becomes gray). This means that my respondents will have to work to find which words require a response.
I want to use javascript to automatically change the background color of the HLTextWord elements without any user interaction. I tried the following, which had the desired effect, but with one bug.
Qualtrics.SurveyEngine.addOnload(function()
{
var elems = document.getElementsByClassName('HLTextWord');
for(var i = 0; i < elems.length; i++) {
elems[i].style.backgroundColor = '#e6ffff';
}
});
This code works initially, but if I click on anything other than an HLTextWord element, or the color selection window, then the highlighting is lost. What do I need to do to make the #e6ffff highlighting persist until the user selects a new color for that element?
Instead of using JavaScript, under Look & Feel/Advanced/Add Custom CSS, add this:
span.HLTextWord {
background-color:#e6ffff;
}
BTW, in case it's important, we recently used the Highlight question in a survey and found out that it doesn't work for people using Android/Chrome v44 (Basically, any recent Samsung Android device where the user hasn't upgraded their browser).