Background video in IOS plays in-player or not at all

I’m trying to have a video background on a page

I’m using video tag with source and with some styling it’s working fine on web and Android, but on IOS it’s not showing unless I add autoplay attribute which is openning video player on IOS devices instead of showing the video in the background :sweat_smile:
code sample:

<video playsinline webkit-playsinline autoplay loop muted  id="bg-video">
     <source src="assets/backvideo.mp4" type="video/mp4">

I tried adding <preference name="AllowInlineMediaPlayback" value="true" /> to confing.xml but that didn’t solve the issue
Does anyone have this issue? How can I overcome it?

I used to have the same problem unitl i found this webcomponent: and it solved for me.

This maybe its not the solution but its a good alternative