Wednesday, August 31, 2005

Background Music

A friend asked me how to embed music in the background of a webpage. I've left the page up for anyone that is interested.

The original article reads:


Background Music


This page uses the embed tag to play a .m3u list of .mp3 songs.


My .m3u list was created with a standard text editor with entries like this:








music/cryin.mp3

music/why.mp3

music/tears_in_the_rain.mp3


The .mp3 files were stored in a music subdirectory relative to the .m3u list.


Then I added the following tag to my website to play the music in the "background".








<embed src="play.m3u" hidden="true" loop="true" />


Because some browsers do not support the <embed> tag, you might want to add the <noembed> tag as an alternate. The <bgsound> tag doesn't support the .m3u playlist, so the alternate would only be able to play a single background .mp3. Other options might include the <object> tag, or consider direct links to each .mp3 as alternatives. Direct links could be set up to work like changing the channel on a radio.


This is the full source using the <noembed> alternative.








<embed src="/play.m3u" hidden="true" loop="true">

     
<noembed>

          
<bgsound src="/music/cryin.mp3" loop="infinite">

     
</noembed>

</embed>


So to set up your system, follow these steps:



1) In the same directory as your .html page, create your .m3u list as shown


2) Put the .mp3 files in the appropriate path according to your .m3u file. (mine was a subdirectory called music)


3) Add the code shown above to your .html page. Include the <noembed> tag pointing to a single .mp3 for unsupported browsers.



A few notes:



  • To stop the music, you can click the STOP button on the browser (usually next to the REFRESH button). :)
  • I added the embed tag at the end of the .html page so the page can load and be read before the music starts. It gives the user something to do while waiting for the music to download in the background.
  • The artist used for the music is Joe Satriani. The songs come from his 1992 album called The Extremist
  • It would be polite to leave the hidden="true" parameter off so users can change tracks on their own, or stop the music.
  • Some versions ( 6 & 7 ) of Netscape do not support the <bgsound> and the <noembed> tags.


That's It!



<br /> <bgsound src="/music/cryin.mp3" loop="infinite"><br />


LOOKING FOR INDIVIDUAL MUSIC DOWNLOADS? TRY SWEETMUSIC

CLICK FOR .COM DOMAINS STARTING AT ONLY $1.99 - HOSTING AS LOW AS $6.95