How to make a video play on Qualtrics | XM Community
Skip to main content
Dear all, I was wondering how I can make this HTML (attached) work on Qualtrics survey. Also regarding the JavaScript code (HTML) I will need it to make the skip ad button appearing next to the video screen, to be moved to the middle of screen and semi-transparent. I will appreciate any help... Here is the code: <html> <head> <style> video::-webkit-media-controls-fullscreen-button { display: none !important; } </style> </head> <body> <video id="myvideo" width="768" height="576" style="background:black" autoplay onplay="clock()" > <source class="active" src="Advert.mp4" type="video/mp4" /> <source src="Main.mp4" type="video/mp4" /> </video> <button style="height:50px;width:200px" class="ui red button" id="btn1" onclick="skip()" disabled>skip ad</button> </body> <script type="text/javascript"> var myvid = document.getElementById('myvideo'); myvid.addEventListener('ended', function(e) { var activesource = document.querySelector("#myvideo source.active"); var nextsource = document.querySelector("#myvideo source.active + source") || document.querySelector("#myvideo source:first-child"); activesource.className = ""; nextsource.className = "active"; myvid.src = nextsource.src; myvid.play(); myvid.controls=true; }); myvid.onpause = function() { window.clearInterval(myTimer); }; function skip(){ var activesource = document.querySelector("#myvideo source.active"); var nextsource = document.querySelector("#myvideo source.active + source") || document.querySelector("#myvideo source:first-child"); activesource.className = ""; nextsource.className = "active"; myvid.src = nextsource.src; myvid.play(); myvid.controls=true; } var myTimer; var c = 12; function clock() { myTimer = setInterval(myClock, 1000); function myClock() { if (c <= 0 ) { document.getElementById("btn1").disabled=false ; document.getElementById("btn1").innerHTML = "SKIP AD"; } else { if( document.getElementById("btn1").disabled==true){ document.getElementById("btn1").innerHTML = "skip ad in " + --c; }} } } </script> </html>
Hi @AliBodyguard! It looks like this question was placed in the 'How to Use the Survey Platform' category. I have gone ahead and moved it to the Custom Code category, so more of our developer/ programmer community members will see it! In the meantime, be sure to check out the following posts to help you get started: * Embedded youtube videos - play only once, no related videos * Query related to video
Thank you for your help, Lauren!