This javascript allows you to bind a lightbox to an image (using the image's ID of #bannerImage) with a click. Put the first .js bit on the initial page and on the page that loads, put the .html below. Of course, please change all variables to the videos, LPs, src .js and .css files.
<video id="my-video" class="video-js" controls autoplay preload="auto" width="964"
poster="MY_VIDEO_POSTER.jpg" data-setup="{}">
<source src="https://pages.cbps.canon.com/rs/879-RFY-317/images/Canon%20LegalWeek%20Final%20-%20720pHD%20-%2030MB.mp4" type='video/mp4'>
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
<a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
</p>
</video>
<script src="https://vjs.zencdn.net/6.6.3/video.js"></script>
<link href="https://pages.cbps.canon.com/rs/879-RFY-317/images/lity.css" rel="stylesheet">
<script
src="https://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous"
type="text/javascript"></script>
<script src="https://pages.cbps.canon.com/rs/879-RFY-317/images/lity.js" type="text/javascript"></script>
<script type="text/javascript">
var $jQ = jQuery.noConflict();
$jQ(document).ready(function(){
$jQ("#bannerImage").click(function(){
lity('https://pages.cbps.canon.com/Video-LegalWeek.html');
});
});
</script>