SO 304270: Stopping a youtube video when Modal is closed

https://stackoverflow.com/questions/30427080/

by Tugzrida

HTML

<script src="//www.youtube.com/iframe_api"></script>
<button type="button" class="btn btn-default" data-toggle="modal" data-target="#myModal">VIDEO</button>
    
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-body">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <div id="player"></div>
            </div>
        </div>
    </div>
</div>

JavaScript

var player;

function loadVideo() {
    player = new YT.Player('player', {
        width: '100%',
        videoId: 'loFtozxZG0s',
    });
}

$('#myModal').on('hide.bs.modal', function (e) {
    player.stopVideo();
});

$('#myModal').on('shown.bs.modal', function (e) {
    player.playVideo();
});

window.onload = loadVideo();