javascript - pause youtube video and show div with a form -
i have youtube video on website:
<div id="video"> <iframe width="560" height="315" src="https://www.youtube.com/embed/some_video" frameborder="0" allowfullscreen></iframe> </div>
after fixed time, want pause , ask user question overlaying form on video:
<h1>how video far? </h1> <div id="question"> <form> <input type="radio" name="question" value="poor" checked>poor<br> <input type="radio" name="question" value="good">good<br> <input type="submit" value="submit"> </form> </div>
what javascript code pause video after fixed period of time , css displaying form nicely? want mimic way lectures on coursera.org once looked like.
tyr this:
html:
<div id="video"> <iframe id="iframe" width="560" height="315" src="https://www.youtube.com/embed/w5mzeveh5ns" frameborder="0" allowfullscreen ></iframe> </div> <div id="message"> <h1>how video far? </h1> <div id="question"> <form> <input type="radio" name="question" value="poor" checked>poor<br> <input type="radio" name="question" value="good">good<br> <input type="submit" value="submit"> </form> </div> <div>
jquery:
<script> $(document).ready(function(){ // hiding message on load $("#message").hide(); // time out function settimeout(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>
Comments
Post a Comment