0

So I've searched all around for an answer and have had no luck...so here I am! I used an html5 video element as a background and it worked fine on web and mobile...until recently. I've tried adding all the attributes for compatibility and I'm pretty sure the CSS is fine, but I will include both here for reference.

HTML

<video playsinline muted autoplay loop poster="/media/images/still.png">
      <source src="/media/videos/backgrounds/strawberry.mp4" type="video/mp4">
      <source src="/media/videos/backgrounds/strawberry.webm" type="video/webm">
      <source src="/media/videos/backgrounds/strawberry.ogv" type="video/ogg">
</video>

CSS

video {
  display: block;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 60vh;
  opacity: 0.9;
  z-index: -100;
}

The only thing I remember changing recently was the video formats. It used to only be .m4v, but converted them to what you see now for easier streaming. You can check the website at http://www.soft-riders.com on your mobile to verify. Any help is appreciated!

ankitkanojia
  • 3,072
  • 4
  • 22
  • 35
Edgar Cuarezma
  • 125
  • 6
  • 1
    Safari, particularly on mobile, is notorious about killing off media whenever it feels like it. It does this to save on power and what not. There may not be much you can do, depending on the exact cause of the issue. – Brad Jan 20 '20 at 05:40
  • This is due to iOS system . – OMi Shah Jan 20 '20 at 05:48
  • Btw, video is playing on my safari iphone 7 – OMi Shah Jan 20 '20 at 05:49
  • 1
    pls go through https://stackoverflow.com/questions/20347352/html5-video-tag-not-working-in-safari-iphone-and-ipad – Ranjith v Jan 20 '20 at 07:07
  • Thanks everyone, for your comments! After digging through here it seems to me that it just comes down to what @Brad said about Safari. What I DID find was that if 'low power' mode is enabled on the iPhone, it disables the autoplay feature. My disdain for Apple has gone up a few points as a result :0 – Edgar Cuarezma Jan 20 '20 at 15:47

1 Answers1

0

Disabling "Low Power" Mode on the iPhone seems to fix the autoplay issue.

Edgar Cuarezma
  • 125
  • 6