onLoad is working great with jQuery to hide unwanted elements for customization. For instance, I'm hiding the question text as well as all the slider numbers. I have noticed, however, that there is a slight delay in which you can see all the elements that are eventually hidden in onLoad. I know the reason is because onLoad is not executed until the page is loaded, but this does provide a flash of the ultimately hidden areas to the user when loading the survey. Is there a way to "beat" onLoad to the punch by essentially hiding these elements earlier in the process? I think css would work, but i'm not entirely sure what the page IDs are for the slider numeric labels and the question text, etc. -- or where to really put that. Thanks in advance for any suggestions!
Best answer by
TomG
9 May 2019, 15:20
View original
A simple solution that works well is just add a div with a lot of top padding to the beginning of your question text to push everything off the screen. Then hide the div at the end of your script. Use an embedded variable to define the padding so it has no impact in edit mode (e.g. padTop = padding-top:2000px).
html:
<div class="padTop" style="${e://Field/padTop}"></div>
Your question text goes here.
Qualtrics.SurveyEngine.addOnload(function() {
/* Your js code goes here */
jQuery(".padTop").hide();
Scanning file for viruses.
Sorry, we're still checking this file's contents to make sure it's safe to download. Please try again in a few minutes.
This file cannot be downloaded
Sorry, our virus scanner detected that this file isn't safe to download.
