I have my survey set up to capture the bounds of an HTML object using element.getClientBoundingRect(). When I preview the survey, the embedded data works as expected. But when I complete the survey using an anonymous link, I run into a problem where everyone who completes the survey has a top bound of 165 and a bottom bound of 165. So clearly it is not actually recording the bounds.



Here is some of my code:

*HTML*

img class="small" src="https://2.bp.blogspot.com/_DAMs68hf4ns/TCrl_5AmwTI/AAAAAAAABBU/z7NQHHNsFzY/s1600/heritagethe-first-thanksgiving-at-plymouth-by-brownscombe.jpg" width="700" id = "attend_image" /></div



*Javascript*

//get coordinates of image

var myElement = document.getElementById("attend_image");

var rect = myElement.getBoundingClientRect();

var imgTop = rect.top;

var imgRight = rect.right;

var imgBottom = rect.bottom;

var imgLeft = rect.left;

});

//save as embedded data

Qualtrics.SurveyEngine.addOnPageSubmit(function(type)

{

if(type == "next")

{

Qualtrics.SurveyEngine.setEmbeddedData("imgTop", imgTop);

Qualtrics.SurveyEngine.setEmbeddedData("imgRight", imgRight);

Qualtrics.SurveyEngine.setEmbeddedData("imgBottom", imgBottom);

Qualtrics.SurveyEngine.setEmbeddedData("imgLeft", imgLeft);

}

});



Any ideas of what the problem might be?