Auto advance after video seen | XM Community
Skip to main content

Help needed on: 

  1. Hiding the next button. 
  2. Auto advance after seeing the video. 

Here is what I have done already. 

I have a survey wherein I want to create a feeling of thought disruption by showing a video. The videos are directly uploaded on Qualtrics. I have used this thread to enable autoplay and removal of controls.

Further to that, the videos I am going to show randomly, vary in time (6, 15, 30, 60 seconds). I want to use auto-advance feature after the video. So, once a respondent has seen the video, the page moves forward automatically. I have tried the following two posts and the auto advance does not work. 

 

I have also tried the auto advance function through ‘Look and feel’ area but as the video is within a text/graphics question, the auto advance does not work and ‘next’ buttong is still shown. 

I am not very good at code, as you can imagine, so, please help! 

Ok. I found the solution myself and here is the code. First, I had to change this iframe code to video tag code. Muted can be kept or removed depending on your preference. 

 

 <video id="fashion6" width="800" height="450" autoplay="" muted =”” playsinline="" style="pointer-events: none;" oncontextmenu="return false;" disablepictureinpicture="">
  <source src="URL HERE" type="video/mp4">
  Your browser does not support the video tag.
</video>

 

Then add following javascript. 

Qualtrics.SurveyEngine.addOnload(function() {
    // Hide the Next button initially
    var nextButton = this;
    nextButton.hideNextButton();
    
    // Get the video element
    var video = document.getElementById("fashion6");
    
    // Ensure the video plays automatically
    if (video) {
        video.play();
        
        // Listen for the video to end
        video.addEventListener('ended', function() {
            // Show the Next button after the video has ended
            setTimeout(function() {
                nextButton.showNextButton();
            }, 500); // Adding a slight delay to ensure proper execution
        });
    }
});

 

Leave a Reply


Terms & Conditions