Hi, i added the above code but it does not work on Android on chrome, I have done some playing around but it only shows on mobile if I add WebM by itself, if I add multiple sources, the video is not shown on mobile again.
** this code does not show on mobile**
<video id='video' playsinline autoplay muted preload='none' width="100%" height="100%">
<source src="https://res.cloudinary.com/cushty/video/upload/c_crop,h_1588,w_2500/v1694428224/MacBook_Air_13-_and_15-inch_with_M2_-_Apple_gidafm.mp4" type="video/mp4"/>
<source src="https://res.cloudinary.com/cushty/video/upload/c_crop,h_1588,w_2500/v1694428231/MacBook_Air_13-_and_15-inch_with_M2_-_Apple_u6wuus.webm" type="video/webm"/>
<p>Your user agent does not support the HTML5 Video element.</p>
</video>
**The code below plays on devices. **
<video id='video' playsinline autoplay muted preload='none' width="100%" height="100%">
<source src=" https://res.cloudinary.com/cushty/video/upload/c_crop,h_1588,w_2500/v1694428231/MacBook_Air_13-_and_15-inch_with_M2_-_Apple_u6wuus.webm" type="video/webm"/>
<p>Your user agent does not support the HTML5 Video element.</p>
</video>
How can we set the code to play different versions depending on the device, it seems like Chrome needs webm to play on the devices.
Thanks
Here is my site Read-Only: LINK
(how to share your site Read-Only link)