1 <!DOCTYPE html>
2 <html>
3 <body>
4 <!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
5 <div id="player"></div>
6
7 <script>
8 // 2. This code loads the IFrame Player API code asynchronously.
9 var tag = document.createElement(‘script‘);
10
11 tag.src = "https://www.youtube.com/iframe_api";
12 var firstScriptTag = document.getElementsByTagName(‘script‘)[0];
13 firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
14
15 // 3. This function creates an <iframe> (and YouTube player)
16 // after the API code downloads.
17 var player;
18 function onYouTubeIframeAPIReady() {
19 player = new YT.Player(‘player‘, {
20 height: ‘360‘,
21 width: ‘640‘,
22 videoId: ‘M7lc1UVf-VE‘,
23 events: {
24 ‘onReady‘: onPlayerReady,
25 ‘onStateChange‘: onPlayerStateChange
26 }
27 });
28 }
29
30 // 4. The API will call this function when the video player is ready.
31 function onPlayerReady(event) {
32 event.target.playVideo();
33 }
34
35 // 5. The API calls this function when the player‘s state changes.
36 // The function indicates that when playing a video (state=1),
37 // the player should play for six seconds and then stop.
38 var done = false;
39 function onPlayerStateChange(event) {
40 if (event.data == YT.PlayerState.PLAYING && !done) {
41 setTimeout(stopVideo, 6000);
42 done = true;
43 }
44 }
45 function stopVideo() {
46 player.stopVideo();
47 }
48 </script>
49 </body>
50 </html>