Change image in multiple choice questions after time delay (java) | XM Community
Question

Change image in multiple choice questions after time delay (java)

  • 25 November 2019
  • 1 reply
  • 10 views

Userlevel 1
Hello,

I want to change the graphics I included in one of the option for a multiple choice question type after certain seconds.
I wrote the following code, but it doesn't work. Does anyone has an idea how to fix it?
I want to change choice A's image to something else after 4000 milliseconds.


var delayTime2=4000;

setTimeout(function(){
console.log(jQuery("#QID68-1-label"));
console.log(jQuery("#QID68-1-label").find("img"));
jQuery("#QID68-1-label").find("img").attr("src","https://iu.co1.qualtrics.com/WRQualtricsControlPanel/Graphic.php?IM=IM_8dCmD7RnfZIh4c5");
}, delayTime2);

});

1 reply

Userlevel 4
Badge +4
First, update your option for the multiple choice question by adding an id to the image. Go to the option you want to change, then click Rich Content Editor, then add your initial graphic by selecting "Insert Graphic", then click "Source" to open the HTML and you should see something like this (values will differ):

`<img src="YOUR ORIGINAL IMG URL HERE" style="width: 1437px; height: 1301px;" />`

Add an id to the image:

`<img id="myidhere" src="YOUR ORIGINAL IMG URL HERE" style="width: 1437px; height: 1301px;" />`

Then use the following JavaScript for that question:

var delayTime2=4000;

setTimeout(function(){
document.getElementById('myidhere').src = "NEW IMAGE URL HERE"
}, delayTime2);

Hope that helps!

Leave a Reply