Timing a background-colour change | XM Community
Skip to main content

Hi everyone,
I've got a multiple choice question that is timed to last 5 seconds and I want the backgound to change colour after 4seconds to indicate when time is running out.
I've been trying to use setTimout in various ways to achieve this but it hasn't worked, for example:

Qualtrics.SurveyEngine.addOnload (function ()
{
setTimeout(jQuery("#Questions").css("background-color","skyblue"), 4000)
});

Does anyone know a fix? Thanks so, so much!

The questions container is for holding the questions. On top of it you have other divs and fieldsets with contain the question and choices. One approach would be to get the question container via JS and apply the colour to it.
let qc = this.getQuestionContainer();
setTimeout(function () {qc.style.background = "skyblue"}, 4000);
This applies only to that specific question. If you want to do it for all questions on the page then use the class

QuestionOuter


Amazing, thanks so much Ahemd!! That worked : )
By any chance, do you know if there's a way to colour the outside of the question container rather than the inside, in the same timed fashion?
Thanks again, you're real life saver!


Leave a Reply