<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <script type="text/javascript" src="https://vjs.zencdn.net/5-unsafe/video.js"></script> <LINK rel=StyleSheet href="https://vjs.zencdn.net/5-unsafe/video-js.css" tpye="text/css"> <div class="container"> <video id="video" class="video-js vjs-default-skin vjs-fill" width="100%" height="100%" controls preload="metadata" data-setup='{}'> <source src="https://vjs.zencdn.net/v/oceans.mp4" type="video/mp4"> <source src="https://vjs.zencdn.net/v/oceans.webm" type="video/webm"> </video> </div>

var player = videojs('video');