Background video IOS display issues

[kareem9000 (Kareem)]

I’m having trouble with my background video on my homepage, it currently works perfect on Android devices and desktops, however when an IOS device loads up the homepage the video will be a still image until the user interacts with the page (i.e scrolling or touching the screen) and THEN it will work. I tried pasting this code snippet i found

The bgVideo element is set to autoplay so i don’t see why this only works on android’s and desktops

Please let me know what i can do to fix this.

Here’s the link : http://kareems-wondrous-project.webflow.io/

Here’s my READ ONLY link : https://preview.webflow.com/preview/kareems-wondrous-project?utm_source=kareems-wondrous-project&preview=418aed7d7fe2a0098b158431a324b4d6

[Thomas_92 (Thomas)]

Hey @kareem9000,

Give this trick from @cpjackman a go, it might fix your issue.

Make Webflow's Background Video PLAY on iOS and Android

Hey guys, This is a neat little trick to make the background video component actually play videos on iOS / Android devices. Right now, Webflow disables it and displays a still image instead, due to previous iOS restrictions that have been recently lifted. You can now use the background video component just like usual, (no need to upload video first, then embed custom code, hack it, etc). Simply insert this quick javascript code snippet before the </body> tag (second custom code box in your s…

Alternatively, you can hide that video slider on mobile and use one with a static image on mobile only. Less ideal, but an easy alternative to avoid any issues on background videos on mobile devices.

[kareem9000 (Kareem)]

I already tried that, it worked but there’s still problems, the video will only play until the end and then stop (rather than loop) even though i set autoplay to 1