Posts Tagged ‘Internet Explorer’

Posted by 6bytes at 1, March, 2011

Category: JavaScript

Tags: , , ,


flowplayer is an Open Source (GPL 3) video player for the web. Allows you to easily embed video streams into your web pages.
While it’s easy to integrate and very powerful occasionally it may give you headaches especially with cross-browser compatibilities.

The most basic configuration looks like this:

	<script type="text/javascript" src="/js/flowplayer-3.2.6.min.js"></script>
	<a id="player" href="/path/to/movie/example_movie.flv"></a>
<script>
	flowplayer("player", "/path/to/file/flowplayer-3.2.6.swf");
</script>

So you’ve done everything according to documentation and your flowplayer works fine in Firefox but not in Internet Explorer and/or Google Chrome.

There’s a couple of things that worked for me:

1. Change Flash player and your movie URL’s from relative to absolute.

	<a id='player' href='http://www.example.com/path/to/movie/example_movie.flv'></a>
	flowplayer('player', 'http://releases.flowplayer.org/swf/flowplayer-3.2.6.swf');

2. Make sure that JavaScript and Flash files are the same version. In our case 3.2.6

3. Edit flowplayer’s JavaScript library flowplayer-3.2.6.min.js (even the minified file). Look for 9,0 and change it to 10,0. This ensures that flowplayer requests Flash player 10 installed in your browser (latest version by the time this post was writen).
OR request a Flash version in your flowplayer start script:

	flowplayer('player', {
		src: 'http://releases.flowplayer.org/swf/flowplayer-3.2.6.swf',
		version: [10, 0],
		onFail: function()  {
			// Write your own message for devices not supporting Flash
		}
	},
	{
		clip: 'http://www.example.com/path/to/movie/example_movie.flv'
	});