An HTML5 player for your music! Pietro Bicocchi – Allegro

This is a GUI implementation of Happyworm jPlayer plugin, an HTML5 audio engine, developed on jQuery framework, that let you listen mp3 and ogg file over the html5 audio tag where supported or using an invisible flash player where not supported. For more informations about html5 browsers’ support go to jPlayer documentation site.

v. 1.8.5


Also available as WordPress® component.

You can find the WordPress plugin here:

What’s new in 1.8.5 release:

  • Bug fix: Added a patch to jPlayer that should have fixed that Android bug. Now works correctly on Android devices too.

What’s new in 1.8.1 release:

  • Feature: The player size is more accurate.
  • Feature: The player is now rendered as DIV instead of TABLE.
  • The skinMaker has been redesigned.
    If you are updating from a previous version you have to replace the CSS file (many classes has been redefined).

What’s new in 1.7.7 release:

  • Feature: Updated to jPlayer 2.5.0.

247 Responses

  1. Omid
    Omid at · Reply

    I had a question,

    I implemented the player in my website…
    one problem im having is that the player buttons are not showing up!
    instead of mute and play i get a P and VM…
    so if you can assist me i would appreciate it.

    1. Matteo Bicocchi
      Matteo Bicocchi at ·

      Hi Omid,
      You miss the mb_audio_font path; be sure that in the css file the @fontface elements are pointing to the correct path to the font.

    2. Omid
      Omid at ·

      Thank You so much for the quick response,
      that totally fixed my problem 🙂


    3. Omid
      Omid at ·

      one more thing is you dont mind 🙂
      can i increase and decrease the size of the player?
      i know it should be possbile with in the css file…it would be nice to know exactly what to change.

      Thanks Matteo

  2. Jimmyracing
    Jimmyracing at · Reply

    We tried both on localhost and on server, with the swf paths set correctly. We just can’t get the player work on any other browsers beside firefox. The player does not even appear…. Any ideas ? We got the demo pack working fine though.

  3. (mb) miniAudioPlayer - HTML5 music player | SmashZine

    […] DEMO – DOWNLOAD – URL […]

  4. Jimmyracing
    Jimmyracing at · Reply

    Thank you for this amazing player! Any idea when new version will come out!? Can’t wait for it 🙂 Having some issues sometimes with .mp3 🙁

    1. Matteo Bicocchi
      Matteo Bicocchi at ·

      Hi Jimmy,
      Which kind of problem do you have?


    2. Jimmyracing
      Jimmyracing at ·

      Well I think we mananged to fix the .mp3 issue. now it works I think, there were some problems with source file. But seems we cant get the player working with any other browser beside firefox. Any idea how to solve this problem?

    3. Matteo Bicocchi
      Matteo Bicocchi at ·

      Hi Jimmy,
      the player should work with amost all new browsers (FF, Chorme, Safari, Opera, IE7+); it is built on the jPlayer framework and it provides flash fallback if your browser doesn’t support HTML5 AUDIO; If you are testing it locally on your computer, flash has sicurity issue that doesn’t allow local file to be loaded till you explicitly autorize the path.
      You can do that by browsing: http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04.html and adding the flash player path you find in the component folder.
      Hope this solve your issue,

  5. saldicess
    saldicess at · Reply

    i downloaded this plugin some days ago, i implemented ir in my website, thats wonderfull
    i neet to pause the audio player at some events but i don’t find how can i do it.

    could you help me please?

    thanks a lot

  6. yousef
    yousef at · Reply

    I am having trouble adding my own music file! does anyone have an idea how i can code my own mp3 into it from a file on my HD?

    I would appreciate any help. Thanks

  7. louie
    louie at · Reply

    Is there a possibility to have the audio auto play?


    1. Matteo Bicocchi
      Matteo Bicocchi at ·

      Not yet…
      On next release.

  8. andy
    andy at · Reply

    great job! question, how could I disable the sliding animation when playing? for example, when the page loaded, the player would be fully extended, and stay fully extended when clicking play?

    I figured it had something to do with

    1. Matteo Bicocchi
      Matteo Bicocchi at ·

      Hi Andy,
      This plugin is realized to slide in and slide out on play/pause actions; to make it always opened you should chage all the logic you find inside the $playBox.toggle(…) from line 137 to line 192…
      Take a look there and if you implement it please let me know.

    2. Guy Massamba
      Guy Massamba at ·

      Hello Matteo B. i should like to get video backgrounds pugin please if you don’t mind could you help me to get them?

    3. Matteo Bicocchi
      Matteo Bicocchi at ·

      Hi Guy,
      did you download the source code?
      There you can find examples.

      download: http://github.com/downloads/pupunzi/jquery.mb.YTPlayer/jquery.mb.YTPlayer.1.2.1.zip


    4. Tamara
      Tamara at ·

      set autoPlay: true . worked fine for me. the player open automatically, you can still see the sliding transition.

  9. kamal sharma
    kamal sharma at · Reply

    i tried to put up a page (html) with your audio ui part . but the page doesn’t show up and shows up a js error as ”
    .audio.mb_miniAudioPlayer is not a function.

    what am i missing??

    Pls help.


    1. Matteo Bicocchi
      Matteo Bicocchi at ·

      Hi Kamal,
      from the error it seams you are not including the jquery.mb.miniaudioplayer.js file into your page.
      Check inclusions path.

    2. Daniel Fagnan
      Daniel Fagnan at ·

      I am getting the same : “.audio.mb_miniAudioPlayer is not a function” error. Though I have checked through browser and it does include the appropriate files. But it seems to work when I use relative paths instead of absolute. Unfortunately I cannot have relative paths because I am using an mvc framework. Is there any other way of doing so?

      Also, sometimes absolute paths work, they have for the past couple days then all of a sudden just doesn’t work.


  10. pupunzi.com has a new skin « Matteo Bicocchi's Blog

    […] HomeAbout memb.jquery.componentsjquery.mb.bgndGalleryjquery.mb.miniAudioPlayerjquery.mb.valueSliderjQuery.mb.verticalSliderjquery mb.extruderjquery mb.menujquery mb.containerPlusjquery mb.galleryjquery mb.maskedGalleryjquery.mb.mediaEmbedderjquery.mb.YTPlayerjquery mb.tabsetjquery mb.tooltipjquery mb.imageNavigatorjquery mb.scrollablejquery mb.flipTextwhere I livewhere I work […]

1 2 3 12

Leave a Reply