Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html>
- <body>
- <!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
- <div id="playerIPN"></div>
- <button id="ytIPN">Button</button>
- <script>
- // 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 <iframe> (and YouTube player)
- // after the API code downloads.
- var player;
- function onYouTubeIframeAPIReady() {
- player = new YT.Player('playerIPN', {
- height: '360',
- width: '640',
- videoId: 'wzJ909w6Hbo',
- events: {
- 'onReady': onPlayerReady,
- 'onStateChange': onPlayerStateChange
- }
- });
- }
- // 4. The API will call this function when the video player is ready.
- function onPlayerReady(event) {
- event.target.playVideo();
- }
- // 5. The API calls this function when the player's state changes.
- // The function indicates that when playing a video (state=1),
- // the player should play for six seconds and then stop.
- var done = false;
- function onPlayerStateChange(event) {
- if (event.data == YT.PlayerState.UNSTARTED && !done) {
- stopVideo();
- done = true;
- }
- }
- function stopVideo() {
- player.stopVideo();
- }
- window.onload = function() {
- var iframe = document.getElementById("playerIPN");
- document.getElementById("ytIPN").addEventListener("click", function( e ) {
- e.preventDefault();
- iframe.src += "&autoplay=1";
- console.log(iframe.src);
- }, false);
- };
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement