How to hide the playtime bar on a video in qualtrics | XM Community
Question

How to hide the playtime bar on a video in qualtrics

  • 12 April 2024
  • 2 replies
  • 17 views
I
Badge

I’m trying to show participants a video (either via a youtube link, or with an uploaded mp3), but I would like to hide the video’s playtime progress/time bar. How can I go about doing this?

 

Thanks!

2 replies

A
Rank
Userlevel 7
Badge +21

You could try this JS.

The progress bar is part of the controls, so only hididng it is difficult. This hides all the controls and appends a play/pause button to control playback.

This will not work for YouTube links.

 

Qualtrics.SurveyEngine.addOnReady(function () {
	const quest = this;
	const qc = this.getquestionContainer();
	const video = qc.querySelector("video");

	video.controls = false;
	const playButton = document.createElement("button");
	playButton.innerHTML = "Play";
	playButton.onclick = function () {
		if (video.paused) {
			video.play();
			playButton.innerHTML = "Pause";
		} else {
			video.pause();
			playButton.innerHTML = "Play";
		}
	};
	video.insertAdjacentElement("afterend", playButton);
});

 

Nanditha MM
Rank
Userlevel 4
Badge +8

Hey @IndyMuk,

When embedding a YouTube video in Qualtrics, you can customize its appearance and behavior using YouTube's embedded player parameters. One handy parameter is "controls," which allows you to hide the video's progress bar.

Here's the HTML code:


<iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEO_ID?controls=0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
 

Make sure to replace "YOUR_VIDEO_ID" with your actual video ID. The "controls=0" parameter hides the video controls, including the playtime progress bar.

If you're working with an uploaded MP4 file, simply replace the "src" attribute with the URL of your MP4 file.

To add this embedded code to your Qualtrics survey:

1. Add a Text question.
2. Switch to HTML view.
3. Paste the embedded code.

 

Thank you!

Leave a Reply


Terms & Conditions