0

On IOS my background video on www.axelmechanicalservices.com wont autoplay while devices are on low power mode. Heres my code and js solution i tried.

 const videoElement = document.getElementById('bg-video');
        videoElement.play().then(() => {}).catch((error) => {
            videoElement.setAttribute("controls","controls"); 
        });
#bg-video {
    min-width: 100%;
    min-height: 100vh;
    max-width: 100%;
    max-height: 100vh;
    object-fit: cover;
    z-index: -1;
    display: block;
}
.bg-video::-webkit-media-controls-start-playback-button {
  display: none!important;
  -webkit-appearance: none;
}
<section class="section main-banner" id="top" data-section="section1">
      <video autoplay loop muted playsinline autoplay="true" id="bg-video" controls="true" poster="assets/images/backvideo.png">
          <source src="assets/images/course-video.mp4" type="video/mp4"  />
          <source src="assets/images/course-video.webm" type="video/webm" />
          <source src="assets/images/course-video.ogv" type="video/ogv" />
      </video>
  • 1
    I don't think you can automatically force the video to play when the device is in low power mode. There is a bit of discussion on this at https://stackoverflow.com/questions/50400902/detect-if-ios11-device-is-in-low-power-mode-to-prevent-bad-ux-on-normally-correc – A Haworth Dec 19 '21 at 20:36

0 Answers0