Does anyone have guidance on how to hide the next button until a Youtube video has finished playing?
I have seen other posts on this topic, but haven't found anything specific to Youtube videos:
· https://community.qualtrics.com/XMcommunity/discussion/comment/50127#Comment_50127
· https://community.qualtrics.com/XMcommunity/discussion/6958/how-to-hide-the-next-button-until-a-video-embedded-from-google-drive-is-finished
· https://community.qualtrics.com/XMcommunity/discussion/6852/how-to-show-next-button-only-after-a-video-inserted-as-media-file-is-finished-playing%29
· https://community.qualtrics.com/XMcommunity/discussion/14377/make-vimeo-iframe-non-interactive-after-pressing-play
Thank you!
Hide next button until Youtube Video (inserted via HTML) is finished playing
+1
+1
Right now, my next button is hidden, but never appears.
My HTML code is:
My JS code is:
Qualtrics.SurveyEngine.addOnload(function()
{
this.hideNextButton();
this.getChoiceContainer().hide();
});
Qualtrics.SurveyEngine.addOnReady(function()
{
var my_vid = document.querySelector("myvid");
const player = new Youtube.Player("myvid");
that = this;
player.on("play", function () {
my_vid.style.pointerEvents = "none";
});
player.on("ended", function () {
that.showNextButton();
});
});
Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/
});
Userlevel 4
+13
You can add a timer question and hide the next button in the logic itself. Let me know if this works for you!
+1
https://community.qualtrics.com/XMcommunity/discussion/comment/51956#Comment_51956Hi grahulp5 ,
Thanks for the info!
Unfortunately, this will not work for my project. I tried the timer question, but it does not adjust for video buffering or pauses. When either happen, my survey-takers end up seeing the next button too early.
Userlevel 5
+25
Hi MadelineB,
I am not familiar with the Youtube API but I imagine the syntax is different to the Vimeo one in your links (which I think some of your code is borrowed from). The documentation suggests to me that you could maybe do something similar:
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. This function creates an