Youtube Video Close on End

Full screen youtube videos that have playlist and play in a loop

by Anton Polyakin

HTML

<script src="http://www.youtube.com/iframe_api"></script>
<div id="container">
    <iframe id="player" src="https://www.youtube.com/watch?v=HYl3g_1uCV0" frameborder="0" allowfullscreen></iframe>
</div>

CSS

#container, #container iframe {
    width:100%;
    height:100%;
    background:#333;
    color:#fff;
    display:block;
}

#container #finished {
    padding:100px;
    font-size:30px;
    font-family:arial, sans-serif;
    text-align:center;
}

JavaScript

function onPlayerStateChange(event) {
    if ( event.data == YT.PlayerState.ENDED ) {
        jQuery('#container').html('<div id="finished">finished</div>');
    }
}

window.onYouTubeIframeAPIReady = function () {
    new YT.Player('player', {
        events: {
            'onStateChange': onPlayerStateChange
        }
    });
};