Code to play Audio automatically as background

Posted: March 4, 2010 in javascript

Sometimes we need to play a background sound on a page. It should automatically play when the page loads.

Here is the script for that and the PlayIt() method called onLoad of the page plays the audio file provided in the <param> tag in body of the HTML.


<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”&gt;
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”
http://www.w3.org/TR/html4/loose.dtd”&gt;

<html xmlns=”http://www.w3.org/1999/xhtml”&gt;

<head>
<meta http-equiv=”Content-Type”
content=”text/html; charset=iso-8859-1″>
<title>Untitled Document</title>
<style type=”text/css”>
<!–
body {
text-align:center;
}
form {
margin:0;
padding:0;
}
–>
</style>
<script type=”text/javascript”>
<!–
function PlayIt(){
document.getElementById(“music1″).innerHTML='<object id=”mediaPlayer” width=”270″ height=”45″ ‘
+’classid=”CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95″ ‘
+’codebase=”http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701&#8243; ‘
+’standby=”Loading Microsoft Windows Media Player components…” type=”application/x-oleobject”>’
+'<param name=”fileName” value=”‘+document.getElementById(‘cancion’).value+'”>’
+'<param name=”animationatStart” value=”true”>’
+'<param name=”transparentatStart” value=”true”>’
+'<param name=”autoStart” value=”true”>’
+'<param name=”showControls” value=”false”>’
+'<param name=”loop” value=”true”>’
+'<embed type=”application/x-mplayer2″ ‘
+’pluginspage=”http://microsoft.com/windows/mediaplayer/en/download/&#8221; ‘
+’bgcolor=”101010″ showcontrols=”false” width=”270″ height=”45″ ‘
+’src=”‘+document.getElementById(‘cancion’).value+'” autostart=”true” designtimesp=”5311″ loop=”true”>’
+'</embed>’
+'</object>’
}
//–>
</script>
</head>

<body onload=”document.forms[‘player’].reset()”>
<form name=”player” action=”PlayIt()” method=”” >
</form>
<span id=”music1″>
<object type=”application/x-mplayer2″ width=”300″ height=”45″ data=””>
<param name=”src” value=”http://onemahindra/sites/specials/X-Mas 2009/i/Shakin’ Stevens – Merry Christmas Everyone.mp3″>
<param name=”filename” value=”http://onemahindra/sites/specials/X-Mas 2009/i/Shakin’ Stevens – Merry Christmas Everyone.mp3″>
<param name=”type” value=”application/x-mplayer2″>
Your system does cannot find the windows media player that was specified.
</object>
</span>

</body>

</html>

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s