Hello,
I am programming a "crossing-out-letter" task in Javascript. The participant is instructed to "cross out" certain instances of the letter 'e'. (For those curious: the participant must cross out all e's which are not right next to or two away from another vowel.). The participant clicks on the letter he or she wishes to cross out, and a blue slash appears. If the participant clicks the letter again, the slash disappears.
I coded up a prototype of the task on JSFiddle, which you can find at https://jsfiddle.net/dzuckerman72/vfc0dtw2/302/. I'm using the HTML element. The prototype seems to be working properly.
When I insert the code into a Qualtrics survey, however, a slight issue arises. To illustrate, I've provided a link to the relevant Qualtrics survey: https://stanforduniversity.qualtrics.com/jfe/form/SV_5pwPvmBNtG65unP. If you click on several letters, you'll notice that sometimes (not always) the surrounding letters are slightly altered (they almost seem to be partially "whited out").
I'm not quite sure what is going on. Since this issue does not arise in my JSFiddle code, I suspect it might be something specific with Qualtrics. Could anyone tell me what's happening, and whether I could alter my code to avoid this issue?
Thanks a lot,
David