The code below makes the video tag work in IE9, Chrome and Firefox. However I cant get it to work in Safari So for Safari, I tried this, Still doesn't work. I did paste the url directly into a Safari address bar and it did bring back the video and play it. Any ideas on how to get the html5

Video tag not working in Safari now

The code below makes the video tag work in IE9, Chrome and Firefox. However I cant get it to work in Safari

<video width="400" height="300" controls="controls" poster="ContractorTestingVideos/cntrtest1.jpg">
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.ogg" type="video/ogg; codecs='theora, vorbis'"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.ogg" type="video/webm; codecs='vp8, vorbis'"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.m4v" type="video/x-m4v"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.mp4" type="video/mp4; codecs='avc1.42E01E, mp4a.40.2'"></source>
</video>

So for Safari, I tried this,

<video width="400" height="300" controls="controls" poster="ContractorTestingVideos/cntrtest1.jpg" src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.mp4"></video>

Still doesn’t work. I did paste the url directly into a Safari address bar and it did bring back the video and play it.

Any ideas on how to get the html5 video tag to work in safari? My Safari build is 5.0.5(7533.21.1) and I am working on a 64 bit virtual machine, OS is Windows 7

Answer

Try rearranging your list of video sources to that your .mp4 videos come first. For some reason, I’ve never been able to get a video to play on Mobile Safari, and rarely on desktop Safari, without doing that.

Like this:

<video width="400" height="300" controls="controls" poster="ContractorTestingVideos/cntrtest1.jpg">
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.mp4" type="video/mp4; codecs='avc1.42E01E, mp4a.40.2'"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.ogg" type="video/ogg; codecs='theora, vorbis'"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.ogg" type="video/webm; codecs='vp8, vorbis'"></source>
  <source src="http://1.1.1.1/Intranet/ContractorTestingVideos/cntrtest1.m4v" type="video/x-m4v"></source>
</video>

Advertisement

Answer