How to properly set up a video background on iOS?

Question

User interface

www.reason.kz
As far as I understand, video backgrounds have a ban on autoplay on mobile devices. On IOS, a big play button appears, which for some reason overrides all other functions of the site. Is there a way to bypass the ban or enable mobile device recognition to just insert a blank?

Answer 1

Hide the video using media queries at the resolution you need, and show the picture on the contrary. For example:

@media only screen and (max-width:767px){
#video-background { display: none }
#picture-instead-of-video { display: block }
}