Question 238902 in Html Question posted in
Some basic documentation can be found here.

Html – video autoplay not working on safari iOS 15.5

so, i have this code:

 <video id="video-collection" loop playsinline autoplay muted data-desktop-vid="./img/yearcolor-page/section_first-video.mp4" data-mobile-vid="./img/yearcolor-page/video.mp4"></video>

as you can see autoplay and muted attributes are set, but on safari iOS 15.5 video still doesn’t autoplay and has this button. i also tested it on iOS 14.8 and all works fine. any idea how can i fix it on iOS 15.5?

update
the problem was in low power mode. now i have another question: is it even possible to force video autoplay with low power mode on?
if not i need at least make play button which safari adds work, because now i doesn’t do anything.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    in case somebody also doesn't know how to solve this problem, i found a solution on this site: https://shaktisinghcheema.com/how-to-autoplay-video-on-mobile-devices-on-low-power-mode/


  2. 0

    Instead of the video tag, try using the object tag to embed the video. Sometimes, this can help with autoplay on Safari. Here’s an example:

    <object data="./img/yearcolor-page/section_first-video.mp4" type="video/mp4">
   <param name="autoplay" value="true">
   <param name="muted" value="true">
</object>

    OR, you can use JavaScript: As a last resort, you can use JavaScript to trigger the video playback after a user interaction event. For example:

    <video id="video-collection" loop playsinline muted data-desktop-vid="./img/yearcolor-page/section_first-video.mp4" data-mobile-vid="./img/yearcolor-page/video.mp4"></video>

<script>
   var video = document.getElementById('video-collection');
   video.addEventListener('click', function() {
      video.play();
   });
</script>

    Hope it will help.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search