Force Vimeo HTML5 Video Embed

问题

I'm trying to embed a Vimeo video and force it to use HTML5 by default.

Here's a thread about doing the same thing I'm tying to do but with YouTube.

Here's another thread talking about getting the Vimeo HTML5 cookie

Here's a discussion of the issue on Vimeo's site. Basically, I would be doing it in response to a user's preference on my site so their concerns don't really apply.

Does anyone know a workaround or way to force HTML5 Vimeo embeds even when Flash is available? (I know the cookie should work in Safari but I have many Chrome users.)

Thanks.

回答1:

Currently there is no way to force HTML5 with the embed script. The "universal player" automatically chooses the format based on the device.

The old embed provides a way to force Flash, but that's the only other option.

Let's hope for the option in the future.

回答2:

On a browser with flash the player loads in html5 mode with the following code. The sandbox prevents the iframe from accessing any plugins including flash.

<iframe sandbox="allow-same-origin allow-scripts allow-popups"
  id="foo" width="100%" height="90%"
  allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen="" 
  src="http://player.vimeo.com/video/28544156?api=1">
</iframe>

To allow the vimeo button to open the vimeo web page for the video you need the 'allow-popups' permission. It's not needed to play the video.

Edit: adding complete example

If you had just a black view it's possible that the video had a size of zero because I had the iframe set to fill parent with width 100%, but if the parent was shrink to fit then that size would still be zero. Here is a whole web page with the CSS to make the video fill up most of the page. Additionally the -webkit-transform will mirror image the video, and then rotate it slightly. If it was displaying in flash this would produce a black screen as it can't handle rotations at all. I have since found out that this probably won't work on firefox at all because it doesn't natively support h.264 which is all vimeo serves, and disabling plugins will disable whatever plugin is making h.264 work on firefox.

<!DOCTYPE html>
<html>
  <head>
    <style>
div {
  display: inline-block;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  position: absolute;
}
iframe {
  -webkit-transform: scaleX(-1) rotate(2deg);
}
    </style>
  </head>
  <body>
    <div>
      <iframe sandbox="allow-same-origin allow-scripts allow-popups"
        id="foo" width="100%" height="90%"
        allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen="" 
        src="http://player.vimeo.com/video/28544156?api=1">
      </iframe>
    </div>
  </body>
</html>

来源：https://stackoverflow.com/questions/12395981/force-vimeo-html5-video-embed

标签

html5-video

vimeo