jPlayer: the CSS styleable jQuery audio player plugin

Tuesday, May 5th, 2009

[Edit: jPlayer 2.x now supports video. Released 20th December 2010.]

With the jPlayer plugin for jQuery it is possible to include a fully customizable mp3 player on webpages. jPlayer has been developed by Happyworm and features standard track and volume controls as well as the possibility to play a playlist.

jPlayer Demo

jPlayer Features:

  • play and control mp3 files in your webpage
  • create and style an mp3 player using just HTML and CSS
  • add sound effects to your jQuery projects
  • improved bandwidth in HTML5 with alternative ogg format support

What’s unique about this plugin is that the designer has full CSS control over the audio player on their webpage. Using standard HTML and CSS, they can style the audio player to be added to their site so that it fits with their overall site design.

The plugin checks for and uses HTML5 <audio> tag support for mp3 and ogg formats in complaint browsers, otherwise it uses a piece of Flash to play the mp3 files. This is hidden from view and the final look of the site is entirely up to the designer. As you’d expect, the operations of the plugin may be customised using bespoke javascript code in the webpages to perform whatever functions required.

For example, the following code automatically plays and then repeats ‘elvis.mp3′ or ‘elvis.ogg’ depending on browser support. Play, pause and stop controls are also made available.

	$("#jquery_jplayer").jPlayer({ // Instantiate the plugin
		ready: function () { // Executed when the plugin is ready
			this.element.jPlayer("setFile", "elvis.mp3", "elvis.ogg").jPlayer("play"); // Auto-play the audio
		oggSupport: true,
		customCssIds: true

	$("#jquery_jplayer").jPlayer("cssId", "play", "play_button"); // Associates play
	$("#jquery_jplayer").jPlayer("cssId", "pause", "pause_button"); // Associates pause
	$("#jquery_jplayer").jPlayer("cssId", "stop", "stop_button"); // Associates stop

	$("#jquery_jplayer").jPlayer("onSoundComplete", function() { // Executed when the mp3 ends
		this.element.jPlayer("play"); // Auto-repeat

<div id="jquery_jplayer"> </div>
	<li id="play_button"> play </li>
	<li id="pause_button"> pause </li>
	<li id="stop_button"> stop </li>
    The MP3 files used must be encoded according to the browser’s Flash Plugin limitations:

  • Constant Bitrate Encoded.
  • Sample Rate a multiple of 11,0025Hz. ie., 22,050Hz and 44,100Hz are valid sample rates.

Please use the jPlayer Google Group for support, bug reports and general discussion.

Mark P

NB: This post has been updated for jPlayer 1.x series. Please visit the main site for the latest documentation for jPlayer 2.x and above.

NB: This thread has been closed. Please use the jPlayer Google Group for support requests.

Tuesday, May 5th, 2009 CSS, flash, HTML, javascript, jPlayer, jQuery

147 Comments to jPlayer: the CSS styleable jQuery audio player plugin

  • Basti says:


    this plugin seems to be great work!

    Is there a way to check if the player is currently playing? I’m not pretty experienced, as you can assume, but it would be great if someone could answer my question.



  • JT says:

    This player is great but I can’t get the demo working.
    I THOUGHT I fixed the paths because the page now says “Now Playing: the Separation” (it was saying “Now Playing: none” earlier).
    But even so, it never starts playing music.

    This is driving me nutty. Any ideas?
    I read through the thread with Lee but I didn’t really understand it (sorry I’m not a developer).

    Any advice would be great.

  • Marcel says:


    Great player ! Just one question, how can I get the current value of myPlayedTime for e.g. in a textfield by pressing a submit button?

    This is what I use:

    #rt_test is a textfield
    myPlayedTime is not working, it should have the value at the moment I press the submit button. It shows the text myPlayedTime now.

    Any idea how to do this?


  • Gajendra says:

    Hi Marc,

    First of all, thanks for a great innovation !

    Now a strange issue. I am from GMT + 530 time zone. While loading the mp3 file, it shows 5 min 23 seconds time as 35:23 as total time. Also running time/ progress is original time + 30 minutes. When I further investigate, I noticed myTotalTime.getMinutes may be this is adding the extra 30 minutes from my time zone. I subtracted the 30 mins and it is showing correct time now.

  • JT says:

    Whoops, I finally got it.
    (forgot to add )

    Thanks again for this.

  • Marcel says:


    Great player. I try to use it to create an online sample from a mp3 file. When the jplayer is playing a mp3 file I want to mark a start and end point by pressing a submit button. The moment the button is pressed the current ‘myPlayedTime’ needs to be stored and displayed in a textfield. I do not know what variable contains the current playtime and how to retrieve this value.

    This is what I have:

    input type=”submit” name=”begin” id=”begin” value=”Begin” onClick=”$(‘#rt_begin’).val(‘???’);”

    rt_begin = a textfield

    All I need to know is what ??? should be. I hope someone can point me in the right direction. I am rather new to jquery but very enthousiastic are trying to learn it.


  • Mark P says:

    jPlayer 0.2.3 beta has now been released. Check out the jPlayer 0.2.3 beta Release notes for the changes. The most notable being HTML5 audio support.

    Note that the original post has been edited so that the code conforms to jPlayer 0.2.3 beta. ie., The use of $(this) in the ready() and onSoundComplete() functions.

    NB: I seem to have fallen behind with comments on this blog, I will reply to them shortly.

  • Mark P says:

    @Stephan: Your link went to so I took a look and found that I had to enable the console in Firefox to get anything to work. IE7 gave runtime errors because of the code in domscript.js line 61: console.log(‘Document ready’);

    The problem you are facing is because of what LightBox does to the Flash. The Flash is being hidden and this causes the Flash to effectively unload from the browser.

    I did a check in my demo 1 by adding the following lines:

    window.setTimeout( function() { $("#jquery_jplayer").hide(); }, 5000);
    window.setTimeout( function() { $("#jquery_jplayer").show(); }, 10000);

    After 5 seconds the Flash is hidden and stops working. After 10 seconds the Flash appears on the page again, which is why the jPlayer ready() event is triggered again causing the music to start playing again from the beginning in my demo.

    Not exactly sure how to solve this problem, but you could try hacking Lightbox for your specific needs. Line 155 below hides items on the page that would freak out the nice page mask that the Lightbox uses. Line 263 below shows them again. The Flash is either in an object (IE) or an embed.

    If you do not use any visible Flash on the same page as LightBox, you could try changing:
    155: $("select, embed, object").hide();
    263: $("select, embed, object").show();

    155: $("select").hide();
    263: $('select').show();

    On a side note, your .click() handlers for the sound buttons should return false; to prevent the default operation. ie., Going to href=”#”.

    I guess that English is not your first language, but I thought the logic of using the class “start” on your sound controls was a little wonky. If you added the class “start” in the HTML page then your code would NOT automatically start the mp3 playback. However, maybe you added this in an attempt to stop the music auto-playing when the LightBox closed.

  • Mark P says:

    @ben: As Uri Tz said, remove the .play() from the $("#jpId").setFile("file.mp3").play(); line in the ready event.

    @Uri Tz: Cheers for helping Ben out.

    @Lee: The problem is that you are using the demo HTML for release 0.2.1 while using the jPlayer release of 0.2.2. There were a few naming convention changes that are causing your problems. Gain access to releases and their set of demos via the download page. The main Demos link works a little funny, due to maintaining a comprehensive set of demos for each release, but this only affects you when you start viewing an older release area.

    @Syed Ahmed: Have you got a development area link that I could review? – In the meantime, your error would imply that the Flash is not available, either because it is not in the default “js” relative directory or you set the constructor swfPath option incorrectly.

    @Genero: You share the same problem as Ben above. Remove the .play() from the $("#jpId").setFile("file.mp3").play(); line in the ready event. As for your second problem, not seeing any images… Have you a development link that I could view?

    @Schoenobates: Thank you for the feedback. Feel free to post links to your jPlayer creations.

    @Tom: You share the same problem as Ben and Genero above. Remove the .play() from the $("#jpId").setFile("file.mp3").play(); line in the ready event.

    @Olga: The source needs to be compiled in order to work. Not the Javascript of course, but the Flash Actionscript 2 file must be compiled into the SWF. Use the MTASC Actionscript 2 compiler. It’s open source and free! View the top of the file for the compile command I used.

    @EnigmaCurry: I am not sure why you are experiencing a 15MB limit on the mp3 file. I will need to look into this and get back to you.

    @Ryan: You share the same problem as Ben, Genero and Tom above. Remove the .play() from the $("#jpId").setFile("file.mp3").play(); line in the ready event.

    @Basti: At the moment, the “is playing” information is not stored directly in the plugin. Depending on what you are doing with jPlayer, you could maybe test to see if the play button ID is hidden or not. Not particularly elegant, but it may do you for now. In future I am considering storing a set of diagnostic data in jPlayer, and whether it is playing or not would be one of these diagnostics.

    @JT: Glad you got your demo working ok. Let me know how you get on.

    @Marcel: This problem is similar to Basti above, where you want to request the state of the player. The states are not stored directly in the current releases. The time information is currently updated 20 times a second via the function provided in a jPlayer.onProgressChange(fn) statement. You could try storing the data and using it from your button.

    $("#jpId").onProgressChange( function(lp,ppr,ppa,pt,tt) {
    myPlayedTime = pt;

    <input type="submit" name="begin" id="begin" value="Begin" onClick="$(’#rt_begin’).val(myPlayedTime);" />

    @Gajendra: Yeah that is odd hey. But I think I know why. I need to change that bit of code in the HTML for the demos so that it uses the UTC time. That will be independent of your timezone. I will review the demos in the future, but in the meantime you should look at the Javascript Date Object. Technically this is a problem with my demos and not the jPlayer plugin itself.

  • Genero says:


    Thanks for your reply re: podcast plays automatically. I have now got it working properly. Awesome player, it fits so well into my site.

    Many thanks for the excellent work.

  • Mark P says:

    @EnigmaCurry: I tested jPlayer using an mp3 file with properties:

    40,642,061 Bytes
    2 channel (stereo)
    44kHz Audio Sample Rate
    42:20 length

    The file worked with jPlayer 0.2.3 in Firefox 3, IE7, Safari 3 (PC). I checked jPlayer 0.2.2 in Firefox 3 and it also worked.

    I’m not sure what to suggest at this time other than checking that your server does not have a maximum response size / file size.

    @Genero: That’s great. You have a nice site. Genero’s jPlayer Podcasts

  • mycm says:

    does it support .wma .wav .mid?

  • Sergey says:

    Mark P , nice work, I was thinking to use soundmanager2 but your player 3 times smaller and I already have jQuery all over my website so Jplayer seems like the way to go for me. Thanks again.

    I was testing it on Mac under Safari 4.0.1 and next/prev tracks does not work , always first track is playing. Please fix as soon as possible.

  • Sergey says:

    Could you please also add or provide method to stop/cancel current downloading process of mp3 file. For example if loading of mp3 file takes too long I want to add stop/cancel link for end users.


    P.S Safari 4 under Windows has same problem as I described in previous post.

    For the future version I would love to see your support for mp4 and RTMP live streaming
    here is example of swf plugin :

  • Mark P says:

    @mycm: Currently jPlayer only supports mp3 format.

    @Sergey: Thank you for pointing out the problem in Safari 4. A fix is in testing and we plan to release it tomorrow.

    You can cancel a download by using the jPlayer.setFile(f) method. If you set the file to the same file that is playing, the download is canceled and the user can choose to restart the download using the play button.

    While we may enable more audio formats in the future, video formats are less likely. We have tried to keep a firm leash on feature creep and supporting many formats is one sure way to bloat the plugin. Maybe once jPlayer matures we will look into developing a different plugin for video.

  • Mark P says:

    jPlayer 0.2.4 beta has now been released. Check out the jPlayer 0.2.4 beta Release notes for the changes. The most notable being HTML5 ogg format audio support for Firefox 3.5 and fixing the Safari 4 bug with jPlayer.setFile() reported by Sergey above.

    Note that the original post has been edited so that the code conforms to jPlayer 0.2.4 beta. ie., The use of {oggSupport: true} constructor option and additional parameter in the jPlayer.setFile( mp3, [ogg]) method.

  • Harry Liddle says:

    Hi, I am using this plugin in an ASP.NET web application, and it works pretty fine, but I am facing a problem just with FF3, where nothing happens after page has loaded, though the same code works fine on all other browsers, FF2, FF3.5, all IEs, Safari, Opera as well as Chrome.

    I don’t know what might be going wrong here, but is this because of the problem between FF3 and Flash 10b, Wonder then how come it works fine on FF3.5. Firebug tells me that the flash is loading fine, but it won’t start playing on its own, and when I click on any of the buttons, firebug throws an error like “m.fl_play_mp3 is not a function”, “m.fl_stop_mp3 is not a function”, etc, in the jquery.jplayer.js.

    This thing also occurs with the same browser on a hosted site as well.
    Another strange thing, when I accessed my local site application on another machine on the network with FF3 and Flash 10b, it worked as it should.

    I wonder what could be wrong here, is it me, or there is something bigger that’s causing this strange behavior.

  • sooze says:

    Hey Mark,

    I have a problem in jquery when a mp3 is downloading.
    If i see the download progress indicator and while its going if i do a ajax request it
    will wait till the buffer download is finished and then execute it.

    So there is a fair delay when working with ajax stuff if the download is going.

    Did you come across this? and do you know a possible work around or solution?


  • till says:

    hi there!

    i am not a very good jquery / javascript programmer, but i love your player and i got it already working!

    now i try to put somewhere else on the page a tracklist, with which i’d like to remote control the player.

    i tried it by using the following code:


    but i doesnt work. i think it is a little more complicated :-)

    any help is very appreciated!
    thx in advance!

  • Mark P says:

    @Harry Liddle: I’m not sure what your problem is. My initial thought was that the Flash Security Settings were stopping you from accessing local content, but that would have affected more than just the FF3 browser. Also, you mention that you had the same problem on a hosted site, where the security should be fine. Accessing your hosted site should be the same as accessing your local site application over your network.

    Do you have a development link that I could view?
    Does your “other machine” work with the hosted site?

    @sooze: I did a basic test to check ajax requests during mp3 downloads and did not find a problem. For more information see the jPlayer Google Group discussion: problem with ajax requests while downloading mp3.

    @till: Maybe this blog did something to your piece of code, but <a>play</a> by itself will not do anything. In our demos we use an unordered list with list items that have an id, which we then associate with the particular control.

    You should look at the 2nd demo if you have not already:
    jPlayer 0.2.4 Playlist Demo

    You say that you’d like the playlist to be separate from the player and this could be achieved by changing the CSS and the placement in the HTML of the lines:

    <div id="playlist_list">
        <!-- The function displayPlayList() uses this unordered list -->

    Tutorials for web technologies are commonplace on the web. I often use for HTML, CSS and JavaScript. jQuery is well documented on its own site.

  • Mark P says:

    As this blog article is becoming rather long, would future bug reports and support requests be made at the jPlayer Google Group.


  • Till says:

    @Mark: Thank you for your answer.
    You are right, the blog did some strange thing to my link :)

    let me describe what i want to do:

    Somewhere on the site is the player. And on another position there are different, lets call them releases, with different tracks. Each track has its own play link, which should remote control the player. As these releases lists are already programmed in php i tried to use a simple a-link tag with a href=”Javascript:function…” to control the player.

    right now i try to create a javascript function:

    function playThisTrack( track ){
    $(“#jquery_jplayer”).jPlayer.setFile( track ).play();

    and on the a-tag i tried to call the javascript function in href= for example like this:


    if you tell me that this works, or that it theoretically is possible, then i will try to find out how it works. you dont have to give me the correct code ;-)

    thx in advace
    cheers, till

  • Mark P says:

    @till: Yes it is possible.

    However, your code needs a tweak:
    function playThisTrack( track ) {
      // $("#jquery_jplayer").jPlayer.setFile( track ).play(); // wrong
      $("#jquery_jplayer").setFile( track ).play(); // correct

    On the jPlayer Google Group there was a link posted that seems to do something similar to what you are after. I’ve copied it below for you.

    Art of Rhyme’s New Joints – Click on a song title and jPlayer appears.

  • Till says:

    @mark: thank you very much for your help!

  • Joe says:

    Having a stop button is stooopid .. pause is more than enough.

  • Lucho says:

    Sometimes the song doesn’t load completely, eg. song duration is 3:15 and the player just load 1:12. Why is that?? How can i fix it? Thanx sry about my english =)

  • Martin P says:

    Hi Mark,

    Firstly, great mp3 player plugin! Its exactly what I was looking for.

    I am having one problem I can’t seem to solve. The function onSoundComplete() is not getting hit when certain mp3′s are finished playing. Have you come across any instances where the onSoundComplete() function does not get hit?

    The code works for some mp3′s so I’ve ruled out the possibility that its my code that is the issue. Could it be the mp3 itself or the way that onSoundComplete() is called?

    Any help with this would be much appreciated.


  • Mitch says:

    Hey Happyworm, just wanted to let you know I used your player, and I’m happy about it! Thank you so much!

  • Mitch says:

    Just when I fell for this script, FF 3.5.2 broke it (I think.) Your demos still work in 3.5.2 but I believe that is because OGG is on. If you set it to false, the whole thing seems to break.

  • Christian says:

    Hi all,
    Mitch is right.
    Since FF 3.5.2 i have a bunch of JS errors.

  • charlie says:

    Hi, Congratulations for this player A+++

    I tried to implement this on ony of my sites, but I don’t know what i’m doing wrong, because when a debbug with firebug return me this error:

    m.fl_play_mp3 is not a function
    [Break on this error] var r = m.fl_play_mp3();\r\njquery.jplayer.js (línea 105)

    m.fl_stop_mp3 is not a function
    [Break on this error] var r = m.fl_stop_mp3();\r\n

    I don’t have any idea what ´re wrong, here is my source code:

    thanks for all

  • Paul says:

    After playing around with jPlayer, I noticed that it’s not such a good idea to use the .stop as the function name. I had a jquery kwicks (sliding menu) on the same page, and it seems that the .stop command interferes with the animation from kwicks. Im pretty sure I’m not using the same ID. And not too sure exactly which part of the source is causing this but I did a global search and replace for “stop” to “stoptrack”, seems to work fine now.

    I’d assume the .stop would somehow interfere with jQuery’s .stop for animation.

    I’m using Firefox 3.0.13


  • Sapher says:

    Hey dude you can create a minified version of your wonderful plugIn with this

  • Patrik says:

    I’m evaluating jPlayer and it seems great!
    Had an issue with FF3.5 not playing mp3s since it uses the html5 code, so I made a change to jPlayer to make html5 optional:

    — jQuery.jPlayer.0.2.4/jquery.jplayer.js 2009-07-01 20:26:20.000000000 +0200
    +++ jquery.jplayer.js 2009-08-16 09:02:56.000000000 +0200
    @@ -43,7 +43,8 @@
    top: 0,
    left: 0,
    quality: “high”,
    - bgcolor: “#ffffff”
    + bgcolor: “#ffffff”,
    + html5: true
    $.extend(config, options);

    @@ -67,8 +68,9 @@

    var configForHtmlAudio = {
    html5: Boolean((config.oggSupport) ? ((config.canPlayOGG) ? true : config.canPlayMP3) : config.canPlayMP3)
    - };
    - $.extend(config, configForHtmlAudio);
    + };
    + if (config.html5)
    + $.extend(config, configForHtmlAudio);

    $(this).data(“jPlayer.config”, config);

  • daniel says:

    Hi, with reference from the souce code in demo “jPlayer as a stylish audio and playlist player” , i am able to get the audio player up and working fine in the latest IE version, however when i tried previewing it in firefox 3.0, the audio does not seem to be able to load . Is there any reason to it ?

  • Mark P says:

    jPlayer 0.2.5 beta has now been released. Check out the jPlayer 0.2.5 beta Release notes for the changes. The most notable being a major bug fix to HTML5 audio support due to browsers adopting the canPlayType(MIME) returning “”, which used to return “no”.

  • Mark P says:

    @Joe: The stop button is easily removed, assuming you know some HTML, CSS and Javascript. You style this thing how you want, all we did was provide some demos that used all the abilities.

    @Luncho: The MP3 files for Flash must be Constant Bitrate Encoded with a sample rate a multiple of 11,0025Hz. ie., 22,050Hz and 44,100Hz are valid sample rates. Otherwise Flash cannot play the MP3 files correctly.

    @Martin P: I expect this is due to the MP3 encoding. See @Luncho above.

    @Mitch: The latest release, 0.2.5-beta fixes this problem. The reason why it broke was due to the HTML5 Draft Spec changing, where canPlayType(MIME) changed from returning “no” to returning “” when a mime type could not be played.

    @Charlie: It looks like you sorted the problem now as seems to work.

    @Paul: Thank you for bringing the stop() naming conflict to our attention. In a future version of jPlayer we will fix this.

    @Sapher: We plan to start releasing minified versions when jPlayer leaves beta. Thanks for the link.

    @Patrik: See @Mitch above. The latest release, 0.2.5-beta fixes this problem.

    @daniel: Not sure why you had this error in FireFox 3.0. If you were using FireFox 3.5.2 then you would had this problem with jPlayer 0.2.4-beta. I just tried the demo on FF3.0.13 and it worked using Flash and MP3 files.

  • Mark P says:

    Note that, commenting on this blog post will now be moderated more strictly.

    Bug reports and support requests should be directed to the jPlayer Google Group.

  • Franco says:

    Hi all,

    First of all, I’m not a programmer. I’m trying to use JPlayer for my personal site. I download the playlist (n. 2) example with all scripts in the right place. When I launch the html site in local, with any browser, all goes well, the track sounds… But, when I click on the “Stop” button, the “Play/Pause” button “disappears” and it’s not possible to use this button anymore. Online all goes well and the button remains. This “local” fact (“Play/Pause” button “disappearing” after clicking “Stop” button) happens, in “any browser”, with “any JPlayer example around the web”.
    May you help me, please?
    Thanks to all,

    Venezia (Italy)

  • Murilo says:

    Great Job =D
    I have one question.
    How I show the name of the song playing in demo player “jPlayer as a stylish audio and playlist player”?

  • opusonline says:

    I realy love the jPlayer!!!

    Is it possible to preload a soundfile?

    I know you said in the developer guide:
    “The plugin does not begin downloading the new file defined by the .setFile() method.”

    I’d like to make a hover-sound like this:

    $(“#sound”).jPlayer({ ready: function(){ $(this).setFile(“blobb.mp3″); } });
    $(‘a’).hover(function(){ $(‘#sound’).play(); }, function(){ $(‘#sound’).stop(); });

    I’d jump to the roof if this would be possible!!!

    perhaps like this:
    $(“#sound”).jPlayer({ ready: function(){ $(this).setFile(“blobb.mp3″).preload(); } });

    Thanks for your help!!!

  • rafal says:

    i try to use your plugin on my website. but i have problem with that.
    when i use it like that:

    ready: function () {
    $(this).setFile(“″, “”).play();
    volume: 100,
    oggSupport: true

    it works fine, but when i change it only for mp3 player:

    ready: function () {
    volume: 100
    it doesn’t work. i have no idea why.

  • Liam Dilley says:

    Hi all.
    I am using this as a sample play podcast for website. A big list of items and each with a play sample element.
    I have all of it working fine and change most of the id elements to classes but I can not change the

    from an ID to class because the plugin uses this. I tried to follow the code of the plugin to switch it to a class but not managed to do it and get it working.
    Anyone have any ideas for this? THanks

  • datamouth says:

    i love the player
    i’m not so savvy in this stuff but i created a player from one of the demos in your page
    the thing is i do not want it to use OGG files
    in safari it seems to work fine
    in firefox it doesnt play anything because its looking for the OGG files
    i’ve tried everything
    is there a solution for this?


  • Mario says:

    For those who still have in trouble with the subject: html5-oggSupport = false, please don’t blame on this great plugin, instead
    -first: check the .swf file path
    -second: verify you have not enabled the firefox addon “Flashblock”, please disable it for jPlayer testing and restart Firefox as “allow flash in this site” won’t work.

  • Mario says:

    “FLASHBLOCK”, the Firefox addon, excuse the misspelling

  • Mario says:

    I’m not a Javascript programmer so I was wondering if in a page with multiple instances it could be possible to stop any (all) playing instances when start playing another. Just for avoiding sound crowd effect.

  • Alwyn says:


    I get this message when running Jquery in no conflict mode:

    m.fl_play_mp3 is not a function



  • Hi,
    This is my first time setting up the player with a playlist.
    I got the demo to work, but once I update the playlist to link to my own audio files, it won’t work.
    Any idea with what the problem might be?
    here is the demo:

    the First item on the playlist is the item of my own, that doesn’t work. This is it’s link.

    I used a converter online to convert to OGG, and this is the link, which I can’t get to play, any ideas why?

    Please, advise!
    Thank you!

  • Alba says:


    Thanks for this great work, again !
    I would like to replace the song title by the cover album when playing
    For sure it’s possible, but i’m just discovering wonderful magic land of jquery, and so a bit hard for me to encode properly
    Are you thinking to upgrade for a version like this ?
    (sorry , frenchy talking …)

    Thank you and keep it up !

  • Nevermind my last message. Got it resolved


    Is there some type of requirement to buffer the audio files instead of the browser having to download the whole file before playing?
    Mine doesn’t seem to stream/buffer them.

  • Do you have an example of how to set the player up just to play a click sound when a link is hovered on?

    i.e. What calls do I need to put in the hover function for the link? No visible player, just a sound effect

  • JS says:

    For some reason I can’t get any of the buttons to work, nor will it play any music.

    It’s calling my jquery file, and jquery.jplayer.js

    what do I do with jplayer.swf? is that needed somewhere?

    my html/css is copied from this site so it should be right.

  • cackharot says:

    Awesome dude!
    Thanks for releasing such a great work!

  • Sena says:

    Any support for streaming over ShoutCast ?

  • Jay says:

    Guys, where are you linking to sites that are using jPlayer? I can’t seem to find it but want some inspiration!

  • Hi,
    This is an excellent script which solved all my work in just 6 hours. Fortunately we were handling mp3 files. I was trying to change the style of the information bar where the elapsed time is been displayed with other things like changing the buttons and the progress bar. What happened is the elapse time strucks for two seconds and it goes well. Again it does struck for 2 seconds for every 4 seconds. I removed the li statements and gave my own span. anyway i am still working on that. thanks to all the people for providing this script.

  • MarkB says:

    @Jay We will be adding a page detailing sites using jPlayer with our next release – due early next year.

  • nuclear_helhound says:

    Hi I used this a while back for – I think I hacked around with it (can’t remember for the life of me why) for quite some time but got it to do what I wanted out of it in the end, would be better if the clickable’s were anchors rather than li elements for accessibility mind. cheers, great plugin

  • Eggert says:

    Hi Mark and thanks for a great JQuery player.

    Is there any way we can hide the file from the .js code, so the end user can’t see the link to the .mp3-file. I do not want my end users to be able to download the mp3 file to their computer and save it there – I only want them to be able to play the song from my website. In the demo source, It’s easy to spot the target file for a download and that is something I would not like:

    $(this).setFile(“″, “”).play();

    Thanks in advance and keep up the good work!

  • Mark Harris says:

    Hi. This plugin is awesome and it worked great for a site I just built until I discovered the audio won’t play in Firefox 3.5.7. It worked fine in 3.0.7. So I researched this entire forum and discovered all the controversy with html5 and that jplayer 0.2.5 fixed that, which is what I am using. I also converted all my mp3s into ogg files and reconfigured my code, and it’s still not working.

    {name:”1. What’s Your Name”,mp3:”/music/01_whats_your_name.mp3″,ogg:”/music/01_whats_your_name.ogg”},

    Would you please mind checking my source or pointing me in the right direction so I can continue to use this wonderful plugin and not abandon it? Thanks so much! – Click on left column “Player”.

  • Larry Battle says:

    I love your plugin, jPlayer.
    I’ve manage to convert a single file into a soundboard. Using other plugins would have been a lot more difficult.

    Use that to make a project for teaching Japanese’s Hiragana and katakana.

  • themia says:

    When I run the demo on my website, I have no problem playing ‘the separation’ (point to the miaowmusic site). When I substitute the mp3 with a local one (I made sure that the path is correct), nothing . . . :(

    What’s the problem?