Video player

Tutorials of (Video player) by Antonio contreras

<!DOCTYPE html>
<html >
  <meta charset="UTF-8">
  <title>Video player</title>
      <link rel="stylesheet" href="css/style.css">


  <button data-video-id="1Q8fG0TtVAY" type="button">open</button>

<div id="video-player" class="playback">
    <button id="close-button" type="button">close</button>
    <div id="video-container"></div>
    <script  src="js/index.js"></script>

/* Downloaded from */
.playback {
    display: none;
} {
    display: block;
/* Downloaded from */
    // private variables

    var videoPlayer = document.getElementById('video-player');
    var videoContainer = document.getElementById('video-container');
    var closeButton = document.getElementById('close-button');
    var openControls = document.querySelectorAll('[data-video-id]');
    var iframeId = 'video-iframe';
    var openClass = 'is-open';

    // private functions

    function controlVideo(iframe, func, event){
        event = event || 'command';
            'event': event,
            'func': func,
            'args': []
        }), '');

    function openPlayer(event){
        var videoId ='data-video-id');
        var poster ='data-poster');
        var iframe = getIframe(videoId);
        // add video iframe
        // show video player

    function closePlayer(event){
        var iframe = document.getElementById(iframeId);
        // stop video playback
        controlVideo(iframe, 'stopVideo');
        // hide video player
        // remove video iframe


This awesome code ( Video player ) is write by Antonio Contreras, you can se more from this user in the personal repository

You can find the original code on

2018 © Antonio Contreras