Can't take credit for this, but it works. You need to replace #$# with the specific image tag from Qualtrics. Below shows place keepers for two images following this "const images = ["





Qualtrics.SurveyEngine.addOnReady(function()

{

(function() {

const images = [

"https://survey.az1.qualtrics.com/CP/Graphic.php?IM=#$# ",

"https://survey.az1.qualtrics.com/CP/Graphic.php?IM=#$# ",

];

const defaultWidth = 400;

const frame = document.getElementById('frame');

const msg = frame.appendChild(document.createElement("h3"));

const img = frame.appendChild(document.createElement("img"));

var awaiting = false;

var loaded = true;

var counter = 0;

var loadedTs;



frame.style["text-align"] = "center";

img.style.margin = "3em auto";

msg.innerHTML = "Press ENTER to start";



function resize(img, factor) { img.style.width = (defaultWidth * factor) + "px"; }



img.onload = function() {

img.style.height = "auto";

resize(img, 1);

img.style.display = "block";

loadedTs = Date.now();

awaiting = true;

loaded = true;

msg.innerHTML = "Press I to zoom in and M to zoom out";

}



document.addEventListener('keydown', function(event) {

const ts = Date.now();

if (!awaiting && loaded && event.keyCode == 13) {

img.style.display = "none";

loaded = false;

if (counter < images.length) {

img.src = images[counter++];

msg.innerHTML = "Loading...";

} else {

msg.innerHTML = "Done!";

}

} else if (awaiting) {

if (event.keyCode === 73) { resize(img, 2); }

else if (event.keyCode === 77) { resize(img, 0.5); }

else { return; }

awaiting = false;

msg.innerHTML = "Press ENTER for next image";

Qualtrics.SurveyEngine.setEmbeddedData('Img'+counter, ts-loadedTs);

}

});

---