the lightbox design actually was made to create autoplaying lightboxes only. There however is a way to do what you intend.
The button or link launches the player and makes it initialize. So when clicking the link, the player actually doesn't exist and therefore cannot be dealt with. You must therefore wait for some milliseconds to let the player initialize. After that, you can easily stop it and show the poster picture. Use a
setTimeout() on the click event and then have three simple steps happen:
- stop the player
- reset all components
- reinitialize all components in order to display the poster image
You can use api calls for that (
initChildren()). They are part of the video.js api and not well documented, sorry for that. Here is a working example: https://codepen.io/moay/pen/LWppPb
In order for this solution to work, you must add your video source(s) as source tags instead of using the
Let me know if this helps!