Pause Youtube Video And Show Div With A Form
I have a youtube video on my website: after some fixed time, I want to pause it and ask the user a question by overlaying a form over the video: What would be the javascript code
Solution 1:
Tyr this:
HTML:
<divid="video"><iframeid="iframe"width="560"height="315"src="https://www.youtube.com/embed/W5MZevEH5Ns"frameborder="0"allowfullscreen ></iframe></div><divid="message"><h1>how do you like the video so far? </h1><divid="question"><form><inputtype="radio"name="question"value="poor"checked>Poor<br><inputtype="radio"name="question"value="good">Good<br><inputtype="submit"value="Submit"></form></div><div>
JQuery:
<script>
$(document).ready(function(){
// hiding message on load
$("#message").hide();
// time out functionsetTimeout(function(){
var yourIframe = ('iframe#iframe');
var src = $('#iframe').attr('src');
$('#iframe').attr('src', '').attr('src', src);//pause youtube video
$("#message").show(); // show message
}, 5000);
});
</script>
Solution 2:
Use the below code to pause and resume the video on opening and closing the popup instead of stop and starting the video again
var iframe = document.getElementsByTagName("iframe")[0].contentWindow;
iframe.postMessage('{"event":"command","func": "playVideo","args":""}','*');
iframe.postMessage('{"event":"command","func": "pauseVideo","args":""}','*');
Post a Comment for "Pause Youtube Video And Show Div With A Form"