embedding an iframe into question prevents scrolling of main Qualtrics page | XM Community
Skip to main content

I'm embedding an iframe into a question like this in the HTML:

 

and I have the following in my JS:
Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/
var qid=this.questionId;
jQuery("#"+qid).css("width","50%", "position","fixed");

});

Qualtrics.SurveyEngine.addOnReady(function()
{
/*Place your JavaScript here to run when the page is fully displayed*/
let qid=this.questionId;

let urlstring = "(embedded website)"

jQuery("#"+qid).css({"position": "fixed", "width":"60%", "right":"20%", "z-index":"0"});
jQuery("#iframediv").html('');

let iframe = document.getElementById("iframe");
iframe.src = urlstring;
});

Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/

});

It loads in correctly, but doesn't allow scrolling of the main webpage, this is particularly an issue with mobile because I can't even reach the question itself. Thank you!

Hi there, I think the question position as fixed might be causing an issue. Try updating that line in the OnReady to the below:
jQuery("#"+qid).css({"position": "relative", "width":"100%", "z-index":"0"});

Also if it helps, I've used the below before, pasting into the HTML/Source view using the Rich Content Editor:




Thanks so much Tom - you're a lifesaver!

alxcay That is indeed true! Thank you Tom_1842 for assisting with the custom code solution! 🙂

Leave a Reply


Terms & Conditions