5/1/2013: Version 1.4b: Fixed minor HTML5 volume control bug and Chrome for Android
would not play audio unless HTML5 load() and play() were added to the code. Note: for HTML5
audio in Chrome for Android you must use Chrome version 25 or newer. To check the version
go type: chrome://version in Chrome address field.
4/18/2013: Version 1.4: New! Now the player
works with iOS, iPhone, iPad, iPod and Android devices using HTML5 audio tag.
so the volume and therefore FadeOut does not work. So on phones and tablets the volume
is controlled by the rocker volume control on the device. Chrome also uses the audio tag now.
So now this player has been tested to work with Internet Explorer, Firefox, Chrome, Safari,
Opera, Netscape, iOS and Android.
3/20/2013: Version 1.2c: Now the current volume is saved between songs
with a variable named current_volume
8/18/11: Created a version (1.3) which has individual play buttons
for each song. Try this link if you
need the version with individual play buttons.
9/18/09: Version 1.2b: Added window.onunload = stop_song;
to bottom of sound.js to prevent IE 7 and 8 from having an
error when refreshing the page because setTimeout was
continuing to call display_time() function.
5/30/09: Version 1.2: Added 'px' to all style top, left
width and height numbers to be compatible with
doctype strict. Also converted html tags to lowercase
to be compatible with xhtml.
New as of 7/12/2008: Added Shuffle button.
Netscape, Mozilla Firefox, Safari and Opera.
Instead of using default windows media player controls
or default Quicktime controls, you can make your own
Easily create a playlist of MP3 music files.
Full Play, Stop, Pause, Rewind, Fast-Forward, Volume,
Previous Song, Next Song and Fade Out controls for
most browsers including IE 6.0+, Netscape 7.1+,
Firefox 1.5+ and Opera 9+.
Play, Stop, Previous Song and Next Song controls for
Safari and other older browser versions.
Automatic playback of next song in playlist in most
How to Use
Right click on sound.js and
save it to your hard drive.
Copy the following textbox and paste it just before
</HEAD> in your HTML document:
Copy the following textbox which contains the player
controls which can be customized and paste it in the body
of your HTML document where you want the player controls
For the Playlist make an invisible textarea
in the BODY of your HTML document
like the one below with each mp3 listed on a seperate line.
Make sure the textarea has the id songlist:
or an easier way to make the playlist is to
right click on the following batch file and save it to your
hard drive in the folder that contains the
mp3 and mid files you want in the playlist:
songs.bat It will create
a file called songs.txt which will contain the
textarea element along with all your songs.
Then paste the information from songs.txt into the body
of your HTML document.
If you are putting your songs in a different folder
from your INDEX.HTML file then edit sound.js and change
the folder variable from var folder = ''; to
var folder = 'music/'; where music is the name of
the folder that holds the mp3 files.