automatically resize to full screen when clicking next button

Question

I am trying to insert some javascript code into qualtrics. I want it to resize the user\'s browser after the user presses the \"next\" button (this is after a short statemen

Answer 1

I think you have a conflict between your NextButton click handler and the Qualtrics NextButton click handler. Qualtrics is winning.

The way I've handled similar situations before is to hide the Qualtrics NextButton, and add my own button that executes whatever code I need before it clicks the Qualtrics NextButton.

Something like this:

Qualtrics.SurveyEngine.addOnload(function () {

$('NextButton').hide();
$('NextButton').insert({
    before: "<input id=\"checkButton\" type=\"button\" value=\"  >>  \" title=\"  >>  \">"
}); 
$('checkButton').onclick = function fullScreen() {
    launchIntoFullscreen(document.documentElement); 
    $('NextButton').click();
};

function launchIntoFullscreen(element) {
      if(element.requestFullscreen) {
        element.requestFullscreen();
      } else if(element.mozRequestFullScreen) {
        element.mozRequestFullScreen();
      } else if(element.webkitRequestFullscreen) {
        element.webkitRequestFullscreen();
      } else if(element.msRequestFullscreen) {
        element.msRequestFullscreen();
      }
}       

});

Answer 2

You should check if that Web API is actually supported inside Qualtrics.

try Modernizer or something like this. how to detect a browser supports requestFullscreen

if it's actually supported then the element wasn't valid and requestfullscreen didn't get invoked.