Play mp3 files in a webpage without gaps?

Question

I have a web page that I would like to play several mp3's one after the other without gaps when the page is loaded. I have tried a couple of js mp3 player type things (niftyplayer, jsPlayer, flash-mp3-player-js) but all f them have have gaps between tracks. Is there any way to do this, with flash or otherwise?

Answer 1

The gaps between the tracks are likely because when a new mp3 plays it needs to load into the memory. If you somehow pre-loaded all the tracks to the memory and played them one after another there should be no gaps. Unless of course there are silent gaps in the start and end of the mp3 file.

Of course loading a bunch of mp3's into the memory isn't optimal, especially if they are large in size.

Also note that there is a difference between caching the files on the clients hardrive which normally happens, and preloading it into the memory.

Answer 2

Use 2 players.

• When the file on Player1 is playing, load next file on Player2.
• When the file on Player1 is about to end (1 or 2 seconds before), play Player2 file and load next file on Player1...
• repeat...

You can do this easy with HTML5 audio tags (no flash needed)

Remember to use a setTimeout or setInterval for the loop.

Answer 3

Your best bet would be to "stitch" them on the server side.