HTML5 video not loading in Safari on iOS 8.2

Here’s my code right now:

<div class="home-text-wrapper">

<?php 
global $smof_data;

if($smof_data['rnr_home_type']=="Callout Text") { ?>

<div class="container homevideo" overflow-scroll="true">
    <video id="video" autoplay loop="" preload="none" style="width: 100%; height: auto;" muted controls poster="http://puppod.com/wp-content/uploads/2013/06/PosterImage.png">
        <source src="http://puppod.com/wp-content/uploads/2013/06/PPiOS.mp4" type="video/mp4">
        <source src="http://puppod.com/wp-content/uploads/2013/06/PPAndroid.mp4">
        <source src="http://puppod.com/wp-content/uploads/2013/06/PupPod.webm" type="video/webm">
        <source src="http://puppod.com/wp-content/uploads/2013/06/PupPod.ogg" type="video/ogg">
            Video not found.
    </video>
</div>

<?php }
</div>

This is a WordPress installation. The PHP activates the video section when the “Callout Text” option is chosen in the theme settings.

Read More

The video works in every other browser, including Safari on iOS prior to the most recent 8.2 update. Currently, on iOS, Safari shows my loading GIF where the video should be and cuts off most of the website.

Any ideas?

Related posts

Leave a Reply