I've been tasked with creating a video thumbnail that, when clicked, will lead the user to a new page where a single autoplaying and looping mp4 video will be shown. The issue arises when I can't interact with the video because the controls are hidden. Ideally, I would like to double click on it to view it in fullscreen mode and have it continue playing.
Despite searching extensively online for a solution, I haven't found any useful information. I came across a suggestion to use JavaScript code like
player.on('dblclick', function() { player.requestFullscreen(); });
, but being limited to HTML, CSS, and plugins within WordPress, I'm unsure how to implement this fix.
Another recommendation was to "Attach a double click(dblclick) event listener to the video, then in the listener call requestFullScreen on the video," however, executing this advice successfully seems challenging.
My video code is straightforward, but lacking the typical controls:
video autoplay loop
source src="https://websitelink.mp4" type="video/mp4"
video
Any attempt to add JavaScript-like code is disregarded or causes the video to disappear in WordPress.
Thank you for your assistance!