JSFiddle - React, Tailwind, and code Playground

by jamie_505

HTML

<body>
    <div style="text-align:center">
        <br>
        <video id="video1" height="236" preload="auto" controls>
            <source src="http://root.gnyp.de/public/LeFloid-Intro.mp4">Your browser does not support HTML5 video.
        </video>
    </div>
</body>

CSS

video.background {
    background: black
}

JavaScript

$('#video1').on('loadstart', function (event) {
    $(this).addClass('background');
    $(this).attr("poster", "http://iphonewrd.com/img/loading.gif");
});
$('#video1').on('canplay', function (event) {
    $(this).removeClass('background');
    $(this).removeAttr("poster");
});