Skip to main content

Forums

This topic contains 4 replies, has 3 voices, and was last updated by  Beverleyh 4 years, 7 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #196322

    StephBertha
    Participant

    Hi there,

    I was playing around trying to get this to work. It works great in Firefox, but doesn’t budge in Safari.

    http://stephaniebertha.com/clients/videobg/

    What am I missing?

    #196338

    shaneisme
    Participant

    This reply has been reported for inappropriate content.

    It’s working for me, unless you’re talking about Safari in iOS. I don’t think videos (or sounds for that matter) can play automatically on mobile devices.

    #196340

    StephBertha
    Participant

    Oh, it’s working for you? Interesting. I’m on a Windows 7 PC and Safari is just showing the “poster” image, but the video isn’t playing. Although I’m using Safari 5.1.7; it won’t let me update to a higher version of Safari.

    #196343

    shaneisme
    Participant

    This reply has been reported for inappropriate content.

    I double checked on Windows, and yeah it’s working there too!

    Apple doesn’t have a Windows version of Safari any higher I’m afraid.

    #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

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

icon-link icon-logo-star icon-search icon-star