html5 tag <video> does not work in safari and IE

问题

I have a webm video running on my site which is not working on safari and IE.

The code I have used is as

<video src="http://video.webmfiles.org/elephants-dream.webm" controls autoplay loop preload="auto" poster="http://my-site.com/images/home-banner.png" class="only-default" width="613" height="354">
   <source type='video/webm; codecs="vp8, vorbis"' src="http://video.webmfiles.org/elephants-dream.webm">
</video>

回答1:

WebM is not supported in IE and Safari

More info here http://www.w3schools.com/tags/tag_video.asp

回答2:

Safari and IE9 require MPEG-4. You can include a second source tag for that.

You should remove the src= attribute inside your video tag when you use source tags.

If you need it to work on IE8 or lower, you can add a Flash player inside the video tag that will play the same mp4 file.

<video controls autoplay loop preload="auto" poster="http://my-site.com/images/home-banner.png" class="only-default" width="613" height="354">
  <source type='video/mp4;' src="video.mp4">
  <source type='video/webm;' src="video.webm">
</video>

来源：https://stackoverflow.com/questions/21829235/html5-tag-video-does-not-work-in-safari-and-ie