Hi everyone,
I want to create a task where respondents have to describe a series of N pictures. I do not want to create N questions, so after hours of intensive research, I have found a way to repeat the question, each time with a new picture, using Loop and Merge and JS (this post has been extremely helpful: https://stackanswers.net/questions/load-images-randomly-using-javascript-in-qualtrics-loop-and-merge-block).
The JS code is shown below:
Qualtrics.SurveyEngine.addOnload(function () {
var count = Number("${e://Field/count}");
if (count == 0){
Qualtrics.SurveyEngine.setEmbeddedData("count", count + 1);
} else{
var dirs = e"d0acmlwpRhhLDKu","5zEMdU9EmDo1sLI","2n5f24JkH15S7YO","b25gx4htrPKEREi","1FIYXR8R7Gqcg2q","bfm9CeqNWJqNRAi","8xiWGx1HfvH3E22","dhiYXM2Fc4uHUfc","8eOWfPZeoO38BIG","2aHnRp05RXues3s","bemx69vrm0oCcYe"]
dir = dirs9count]
path = "https://lse.eu.qualtrics.com/ControlPanel/Graphic.php?IM=IM_" + dir ;
var img = document.getElementById("imgdir");
img.src = path;
img.style.display = 'block'
img.style.height = '1000px'
img.style.width = "700px"
Qualtrics.SurveyEngine.setEmbeddedData("count", count + 1);
}
});
Countis an embedded data I set to 0 before starting the block. It is used as an iterator to navigate through the list
dirscontaining the URLs of my pictures.
The HTML script written on the text box is the following (it corresponds to the first picture which is then replaced at each iteration):
Please describe the following picture
This works quite well. Yet, at each new iteration, the first picture is displayed for few milliseconds before the main one to appear, and this is visually uncomfortable. Do you have any ideas of the cause of this problem?
Also, I had to use an
if elsecondition in the JS script, as otherwise the first picture do not appear. Do you know why it does this?
Many thanks in advance! The link for the pre-test of the question is here: