Tocar música no site

Para tocar um arquivo mp3 no mesmo estilo do youtube "rodar enquanto carrega", a sugestão é usar um player em swf que se encontra na web.

Pode fazer download do arquivo nesse endereço:

http://www.socialsportclub.com.br/music.zip
(contém o player.swf e um exemplo music.html)

É possível configurar as cores e propriedades como autostart e loop.

No exemplo, quando a página carregar o Player vai inciar a música automaticamente (autostart) e vai ficar ficar repetindo (loop).

Então, crie uma página html e na tag head coloque o javascript:

------------------

<script language="JavaScript">
var ap_instances = new Array();

function ap_stopAll(playerID) {
for(var i = 0;i<ap_instances.length;i++)
{
try
{
if(ap_instances[i] != playerID)
document.getElementById( "audioplayer" + ap_instances[i].toString() ).SetVariable("closePlayer", 1);
else
document.getElementById( "audioplayer" + ap_instances[i].toString() ).SetVariable("closePlayer", 0);
}
catch( errorObject )
{
// stop any errors
}
}
}

function ap_registerPlayers()
{
var objectID;
var objectTags = document.getElementsByTagName("object");
for(var i=0;i<objectTags.length;i++) {
objectID = objectTags[i].id;
if(objectID.indexOf("audioplayer") == 0) {
ap_instances[i] = objectID.substring(11, objectID.length);
}
}
}

var ap_clearID = setInterval( ap_registerPlayers, 100 );
</script>

------------------

Depois, no Body crie o objeto:

--------


<object type="application/x-shockwave-flash" data="player.swf" id="audioplayer1" height="24" width="290">
<param name="movie" value="player.swf">
<param name="FlashVars" value="playerID=1&bg=0xf8f8f8&leftbg=0xeeeeee&lefticon=0x666666&rightbg=0xb8b160&rightbghover=0x999999&righticon=0x323232&righticonhover=0xffffff&text=0x666666&slider=0x666666&track=0xFFFFFF&border=0x666666&loader=0xb8b160&loop=yes&autostart=yes&soundFile=sua_musica.mp3">
<param name="quality" value="high">
<param name="menu" value="false">
<param name="wmode" value="transparent">
</object>

--------

Perceba que em no parametro "FlashVars" você configura as cores podendo personalizar de acordo com as cores do seu site.

O FlashVars é composto de uma string com diversos parametros, entre eles os responsáveis por iniciar a música automaticamente e por repetir a música sem parar (se o usuário não clicar no pause) são loop=yes e autostart=yes, e para desativar o loop o autostart basta substituir o valor yes por no.

Se você ainda quiser fazer a música rodar sem parar mesmo quando o usuário navega pelos links que provocam reload na página, daí só colocando um iframe ou alguém comente uma outra forma que não seja desenvolvendo todo site em flash pois não sou muito fã do iframe.

E era isso ...

-----