jplayer for video only works in Chrome - not FireFox or IE8

Question

I'm not finding much support for this, so I'm guessing there's a simple problem with my jQuery. Any reason why this would only play in Chrome, but not FireFox 7.0.1 or IE8

<script type="text/javascript">
    $(document).ready(function () {

        $("#jquery_jplayer_1").jPlayer({
            ready: function () {
                $(this).jPlayer("setMedia", {
                    m4v: "Media/sample_iPod.m4v"
                }).jPlayer("play");
            },
            swfPath: "../Data/Sites/1/skins/CCG/js/Jplayer.swf",
            supplied: "m4v",
            size: {
                width: "640px",
                height: "360px",
                cssClass: "jp-video-360p"
            }
        });
    });
</script>


<div id="jquery_jplayer_1" class="jp-jplayer">
</div>

Any help is appreciated.

Answer 1

My understanding is that if the browser falls back to flash it will be calling the media from the user's location, not the server location. Try using absolute urls to your media.

m4v: "http://<yourHost>/Media/sample_iPod.m4v"

Answer 2

In my case there were a whole pile of issues stopping jPlayer working in IE8:

1. the swf file that IE8 loads as a fallback had the wrong path. I noticed this by viewing the http traffic in Fiddler.
2. the SWF file itself was missing and had to be copied from the demos folder and installed in the swfPath
3. the video had to be re-encoded with device: iPod, Web Optimised in Handbrake as m4v.
4. it needed a poster image or the flash player that it loaded appeared underneath the jPlayer.

Finally it worked!

Answer 3

$(document).ready(function(){
  $("#jpId").jPlayer({
        volume: 0.10,
        solution:"html,flash",
        mode: 'window', // this row is somehow crucial for safari
        preload:"auto",
        loop: true,
        errorAlerts: true,
        cssSelectorAncestor: "",
        cssSelector: {
           play: ".play",
           pause: ".pause",
        },
        ready: function () {
            $(this).jPlayer("setMedia", {
                oga: "http://www.mydomain.com/silentnight.ogg",
                m4a: "http://www.mydomain.com/silentnight.m4a",
                mp3: "http://www.mydomain.com/silentnight.mp3"
            }).jPlayer("play"); // Attempts to Auto-Play the media
        },
        supplied: "mp3,m4a",  //,oga
        swfPath: "/js"
  });
}); 

Note: this is for audio, but I guess it would work the same with video, so you could give it a try.

I've wasted my whole day tryin to get this to work on ie8, but as you look at the demos on jPlayer's homepage, they also wont work. Microsoft should declare IE8 dead.

With this I managed atleast to get it working with FF,Chrome and Safari. As I understand there is something wrong with the 2.1.0 version, some people in their google group advise downgrading to 2.0.0