Internet Explorer not showing Flowplayer-Video

Question

I recently switched to Flowplayer (I was using VideoJS before) and I encountered yet another problem with our beloved Internet Explorer.

I'm trying to show an mp4-video (.h264-codec) with flowplayer, and it works perfectly in all browsers (chrome, firefox, safari, opera), but not in internet explorer. Strangly enough, in IE9 it just says «Video file not found», while in IE7-IE8 it says «Unsupported video».

<div class="flowplayer">
   <video poster="/videos/poster_bbb.jpg" width="222" height="125" src="/videos/bbb.mp4"></video>
</div>

I also tryed using the tag inside the tag, I tried reconverting the video, I tried using an absolute and web path to the video, all without results.

Note: Since the user should be able to upload his own .mp4 video, I can't use other tags for .ogg or .webm

Thanks in advance!

Elveti

Answer 1

I had the same problem. It worked everywhere fine, except IE. It is because IE is looking for video using relative path from location where is flowplayer.swf located. But others browsers are using relative path from location where is executing script. So you can either try it with absolute path or I am using this workaround for now:

I have following structure

player/flowlayer.swf
movie/data/Video/video.mp4
play.html

Than to play the movie from play.html - where is linked flowplayer.swf I am using conditional comments.

<div class="flowplayer" data-engine="flash" data-swf="./player/flowplayer.swf">
<video autoplay>
  <!--[if IE]>
     <source type="video/mp4" src="../movie/data/Video/video.mp4"/>
  <![endif]-->
  <!--[if !IE]><!-->
     <source type="video/mp4" src="movie/data/Video/video.mp4"/>
  <!--<![endif]-->
</video>
</div>