Problem with song playing with Firefox and IE

464 views
Skip to first unread message

Krysto

unread,
Apr 29, 2011, 1:30:02 PM4/29/11
to jPlayer: HTML5 Audio & Video for jQuery
Hey,

I started using jPlayer today, and got it work with my css on Chrome.
It's very simple, and it's the better mp3 script I have uses so far !
But I have an issue with IE and firefox, the song wont play ...
Maybe I did something wrong, here's my script :

function play(song){
$("#jp").jPlayer("destroy");
$("#jp").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
solution:"flash,html",
supplied: 'mp3',
volume: 0.8,
muted: false,
cssSelectorAncestor: '#player_back',
mp3: song
}).jPlayer("play");
},
ended: function (event) {
$(this).jPlayer("play");
},
swfPath: "js/player",
supplied: "mp3"
});
}

<a onClick=Power to love.mp3">Jimi Hendrix</a>

When I click on this link on Chrome, the song just play fine, but not
on IE and FF.

Here is my player :

<div id="jp" style="height:0px;visibility:false;"></div>
<div id="player">
<div id="player_left">&nbsp;</div>
<div id="jp_interface_1">
<div id="player_prev">&nbsp;</div>
<div class="jp-play">&nbsp;</div>
<div class="jp-pause">&nbsp;</div>
<div id="player_suiv">&nbsp;</div>
<div class="jp-mute">&nbsp;</div><div class="jp-unmute">&nbsp;</
div>
<div class="jp-div">
<span id="jp-artiste" class="jp-artiste">Jimi Hendrix</span><span
id="jp-song" class="jp-song"> - Power to love</span><span class="jp-
current-time"></span><span class="jp-slash">/</span><span class="jp-
duration"></span>
<div class="jp-volume-bar"><div class="jp-volume-bar-value"></
div></div><div class="jp-progress"><div class="jp-seek-bar"><div
class="jp-play-bar"></div></div></div>
</div>
</div>
<div id="player_right">&nbsp;</div>
</div>

If someone could help me I would be very grateful !!


Thanks in advance

Krysto

unread,
Apr 29, 2011, 1:48:27 PM4/29/11
to jPlayer: HTML5 Audio & Video for jQuery
My FF version is the last one. And I already tried to put the absolute
URL.

Mark Panaghiston

unread,
Apr 29, 2011, 4:12:46 PM4/29/11
to jpl...@googlegroups.com
Hello Krysto,

You are messing up the options in the constructor. You are mixing jPlayer constructor options with the media object sent to the setMedia method.

It should look like this instead.


$("#jp").jPlayer({
 ready: function () {
  $(this).jPlayer("setMedia", {
   mp3: song
  }).jPlayer("play");
 },
 ended: function (event) {
  $(this).jPlayer("play");
 },
 solution:"flash,html",
 supplied: 'mp3',
 volume: 0.8,
 muted: false,
 cssSelectorAncestor: '#player_back',
 swfPath: "js/player",
 supplied: "mp3"
});

Best regards,
Mark P

Krysto

unread,
Apr 29, 2011, 5:12:57 PM4/29/11
to jPlayer: HTML5 Audio & Video for jQuery
Hello,

Thank you so much for the fast answer.
I understand realy better how works everything after reading your
answer.

However, I still have the same issue with IE and FF, it still working
fine with Chrome.


I even tried to copy/paste an exemple from the official jPlayer
website (the one with the simple mp3 player), it works on Chrome but
not in FF and IE.
(http://www.jplayer.org/latest/demo-01/)

But when I go online at this address, it works ! Do you think that it
may be a problem with my apache server or something like that ?
apache version : 2.2.13
php version : php 5.2.10 (don't think their is something to do with
php version)

Thank you in advance,

Christopher,

B3n

unread,
Apr 29, 2011, 7:33:21 PM4/29/11
to jPlayer: HTML5 Audio & Video for jQuery

I am also having the same problem, and have also tried putting the
specified media file in the same directory, as i thought it might be a
security "feature" of IE and FF.

This did not solve the problem. But i can collaborate that chrome
works perfectly, whilst both the other two don't work.

Krysto

unread,
Apr 30, 2011, 6:11:20 AM4/30/11
to jPlayer: HTML5 Audio & Video for jQuery
I'm glad not to be the only ...

Is the demo (http://www.jplayer.org/latest/demo-01/) working for you
on FF and IE ?

I tried to broadcast my work to try on another server, it did not work
either.
I tried to copy/paste the jquery.jplayer.min.js from the website
sources, didn't work.

I'm still working on this issue, we'll keep each others informed

B3n

unread,
Apr 30, 2011, 10:23:12 AM4/30/11
to jPlayer: HTML5 Audio & Video for jQuery
Yah, At least we aren't alone! :) i cannot get my version to work,
but that demo works fine. i tried copying nearly their entire code,
and still no luck. thought it might have something to do with the
"<script type="text/javascript" src="../js/
jquery.jplayer.inspector.js"></script>" they include, but downloading
the .js and adding it to my page didn't solve it.

Krysto

unread,
Apr 30, 2011, 10:33:10 AM4/30/11
to jPlayer: HTML5 Audio & Video for jQuery
Hehe :)
I think the inspector is just for "inspecting", "recording" what's
going on when the playing.

I had a break, I will work on this, I really really really need to get
it work !

Krysto

unread,
May 1, 2011, 6:34:03 AM5/1/11
to jPlayer: HTML5 Audio & Video for jQuery
It even works on the android browser !!!
I tried everything ....

Mark Panaghiston

unread,
May 2, 2011, 5:40:26 AM5/2/11
to jpl...@googlegroups.com
Hello Krysto and B3n,

Both your problems are that you have failed to set the swfPath correctly.

The swfPath is vital when the Flash fallback is required, such as when using only mp3 files on the Firefox browser or legacy IE6/7/8.

The reason why you failed to get our demos to work through directly downloading then, is that they are designed to work with the URL system used by jplayer.org. This is why we provide the Demos ZIP file from the downloads page. You can put that on your server and they will work.

The default swfPath is "js" which means a path relative to the current page. Our demos use a relative path for ease, however we recommend that you use an absolute path. This becomes important if you plan to have many jPlayers across your site and do not want to have hundreds of copies of the SWF file.

http://www.jplayer.org/latest/developer-guide/#jPlayer-option-swfPath

http://www.jplayer.org/latest/quick-start-guide/step-1/

Best regards,
Mark P.

Krysto

unread,
May 2, 2011, 8:50:19 AM5/2/11
to jPlayer: HTML5 Audio & Video for jQuery
Hello,

Thank you for answering us.

Juste before you post your answer I tried to enable error with
errorAlerts: true, and it said something with the cssSelectors, so I
defined all cssSelectors.
Now I have :
jPlayer 2.0.0 : id='jp' : Error!

Attempt to issue media playback commands, while no media url is set.

Use setMedia() to set the media URL.

Context: play

So I tried to put absolute path, and it works !!!!

Thanks a million ! This is just the best mp3 script ever !
I wish you the best in life !

Krysto

unread,
May 2, 2011, 8:59:32 AM5/2/11
to jPlayer: HTML5 Audio & Video for jQuery
Hum .... working in FF but still not working on IE ... I tried to put
absolute path for mp3 too but not working !

I have :
jPlayer 2.0.0 : id='jp' : Error!
Attempt to issue media playback commands, while no media url is set.
Use setMedia() to set the media URL.
Context: play

Again,

Thank you,

On 2 mai, 13:50, Krysto <cdu...@gmail.com> wrote:
> Hello,
>
> Thank you for answering us.
>
> Juste before you post your answer I tried to enable error with
> errorAlerts: true, and it said something with the cssSelectors, so I
> defined all cssSelectors.
> Now I have :
> jPlayer 2.0.0 : id='jp' : Error!
>
> Attempt to issue media playback commands, while no media url is set.
>
> Use setMedia() to set the media URL.
>
> Context: play
>
> So I tried to put absolute path, and it works !!!!
>
> Thanks a million ! This is just the best mp3 script ever !
> I wish you the best in life !
>
> On 2 mai, 10:40, Mark Panaghiston <mark.panaghis...@gmail.com> wrote:
>
>
>
>
>
>
>
> > HelloKrystoand B3n,

Mark Panaghiston

unread,
May 2, 2011, 11:45:07 AM5/2/11
to jpl...@googlegroups.com
Hello Krysto,

FYI: jPlayer 2.0.0 has a bug in the warningAlerts option. It shows warning alerts when errorAlerts it true. This was fixed in patch jPlayer 2.0.1. The warning alerts also interfered with the Flash fallback's ready event, which was also fixed. It only was a problem when you turned on the alerts.

I do not think this is your problem.

I'd bet that you have a trailing comma somewhere in your JSON. IE6/7 is strict on that.

I also considered that you did not have the latest version of Flash installed, but that should have given another error alert - NO_SOLUTION.

I doubt I will be able to help you any more unless you post a link to your project so that I can see your code. Please do not slap it all in an email.

Best regards,
Mark P
Reply all
Reply to author
Forward
0 new messages