If you’re inclined to design or get designs with mp4s embedded in them, you’ll know that iPhone starts crying a lot of the time with them. Well after much mooching around the place and trying to get this under control I think I finally have a good working system. It’s seemingly down to the ‘playsinline’ command in html5 video.
Hey, as a bonus there’s an image for a poster in there and the vid starts at where the poster should be (the first frame)
<video controls="true" playsinline muted loop preload="none" poster="<?php bloginfo('template_url'https://amwwivjlur.cloudimg.io/); ?>/inc/img/vid/clientposter.jpg" id="barvid"><br> <source loop src="<?php bloginfo('template_url'); ?>/inc/img/vid/clientsvideo.mp4#t=0.1" type="video/mp4"/><br> <source src="<?php bloginfo('template_url'); ?>/inc/img/vid/clientsvideo.ogg#t=0.1" type="video/ogg"/> </video>
Need rapid website development:
For smaller projects at high speed
-
Adding script tag embed to Gatsby component
Read More -
Get more than 100 queries in GraphQL (I felt stupid)
Read More -
Animate on Scroll (AOS) into Nuxt js
Read More -
WordPress Super-admin hack
Read More -
Add content or ACF field under thumbnail/image gallery in Woocommerce
Read More