...

View Full Version : Trouble playing embedded music OnClick



DoLordBoy
06-12-2004, 10:51 PM
Okay, I'm trying to make a page that functions as a top navbar, which allows you to play music by clicking a link. When you click the link, an embedded song will play and the name of the song will appear in the "Now Playing:" section. The "Now Playing:" part works, but it doesn't seem to want to play the embedded song.

The variables are: songfilename (name of the mp3. in the Music folder), songname (Title of the song which will be displayed), artist (Artist name which will be displayed), artistwebsite (website of the artist). Since all but the first one work fine, please try to follow the part about playing an embedded song and tell me where I went wrong. (I highlighted the parts about embedding in red). Thanks in advance!



<html>
<head>
<title></title>
<script type="text/javascript">
function startMusic(songfilename, songname, artist, artistwebsite)
{
document.getElementById('embMusic').src='Music/' + songfilename;
document.getElementById('NOWPLAYING').innerHTML='Now Playing: <font color=red><b>' + songname + '</b></font> by <a href=' + artistwebsite + ' target=_display class=ARTIST>' + artist + '</a>'
}

function stopMusic()
{
document.getElementById('embMusic').src='';
document.getElementById('NOWPLAYING').innerHTML='Now Playing:'
}
</script>
</head>
<body>

<h2>
Music:
&nbsp
<a href="javascript:startMusic('You_Alone.mp3','You Alone','Something Like Silas','http://www.somethinglikesilas.com')">
You Alone
</a>
&nbsp
<a href="javascript:startMusic('Better_Is_One_Day.mp3','Better Is One Day','Something Like Silas','http://www.somethinglikesilas.com')">

Better is One Day
</a>
&nbsp
<a href="javascript:startMusic('Reach_Me.mp3','Reach Me','MercyFlood','http://www.Mercyflood.com')">
Reach Me
</a>

<a href="javascript:startMusic('Welcome_Home.mp3','Welcome Home','MercyFlood','http://www.Mercyflood.com')">&nbsp
Welcome Home
</a>
&nbsp
<a href="javascript:startMusic('You_Are.mp3','You Are','MercyFlood','http://www.Mercyflood.com')">
You Are
</a>
&nbsp
<a href="javascript:stopMusic()">
No Music
</a>
</h2>
<h3>
<DIV ID="NOWPLAYING" align=bottom>Now Playing: </DIV><DIV ID="WEBSITE" align=right></DIV>
</h3><hr>

<br><br><br><Br>
<embed src="" autostart="true" hidden="true" Id="embMusic">
<br>

</html>

scroots
06-12-2004, 11:12 PM
one think you could do is use a div element to do a similair thing, but it may be workable.

e.g.

<div id="music">

</div>

You can then alter the contents of it by doing


music.innerHTML="<p>hello world</p>"



Based on this you could do


var myfile="music.mp3";

music.innerHTML='<embed src="'+myfile+'" autostart="true" hidden="true" Id="embMusic">';



scroots

DoLordBoy
06-12-2004, 11:22 PM
Hey thanks, it worked.

Just for the sake of wondering though, does anyone know why the code I tried before wouldn't work?

scroots
06-13-2004, 02:42 PM
wwhat broswer where you trying the old code in as i think it uses a broswer specific function (get element by id).

scroots.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum