Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS My Video Background Won't Play in Safari? Reply To: My Video Background Won't Play in Safari?

#196435
Beverleyh
Participant

Just in case its useful to you, here is some info for video/audio use in Safari: https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html

It’s worth noting that you get the circular “play” triangle in iPhone/iPod, which can look a bit hinky in an otherwise sleek design, so if you’re going that route, maybe hide the video element (and consequently, the play icon) offscreen with negative margins in small screen devices?

The page also details what Shane said about there being no autoplay over mobile/cellular networks (to help preserve data allowance). Media only plays if the user sets it going manually.

Just wondering too, have you thought about maybe making the video responsive too? “object-fit” is coming on in CSS (like background-size:cover; for videos). It isn’t quite there yet though but you can fudge some aspect-ratio media queries in to the mix and come up with a pretty workable pseudo background-size:cover; for video http://fofwebdesign.co.uk/template/_testing/fullscreen-video/

Hope that helps