Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

webdevelopermgri

Iniciar e Para som

Por , em Desenvolvimento frontend

Recommended Posts

webdevelopermgri    0

webdevelopermgri
Postado

Olá, boa tarde.

Não sei se esse é o melhor lugar para se postar essa dúvida, senão for, por favor movam para o local certo.

 

Possuo um site, onde o tenho um botão, nada em flash e gostaria de ao entrar no site um mp3 fosse executado e ao clicar no botão parar/iniciar.

Existe como isso ser feito?

Valeu e fiquem na paz.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Bruno Augusto    417

Bruno Augusto
Postado

Fiquei bastante tempo aqui no tópico, não por encontrar uma solução, mas para fazer a solução encontrada funcionar no meu PC. :P

 

De acordo com esse artigo, deve-se usar a tag <object> para isso.

 

<object archive="soundfile.mid" codetype="audio/mid">

Os controles primitivos, porém, devem ser feitos em JavaScript.

 

Obtive-os a partir daqui

 

O Play foi fácil e certeiro. Basta atribuir ao atributo data o mesmo valor do atributo archive.

 

Nesse último link, porém, diz que o jeito de fazer o Stop seria recarregar a página via JavaScript, via window.location.href.

 

Eu discordo :devil:

 

Talvez ele/ela nem tenha testado, mas bastou um NULL ser atribuído à propriedade data que o som parou.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

<title>Background Sound</title>

<script type="text/javascript">

   function controls( action ) {

       var obj = document.getElementById( 'O1' );

       if( action == 'play' ) {
           obj.data = obj.archive;
       }

       if( action == 'stop' ) {
           obj.data = null;
       }
   }

</script>
</head>
<body>
   <p>
       <object type="audio/mid" id="O1" width="1" height="1" archive="Addams_Family.mid">
       </object>

       <br />

       <button type="button" onclick="controls( 'play' )">Play</button>
       <button type="button" onclick="controls( 'stop' )">Stop</button>
       </object>
   </p>
</body>
</html>

Experimente trocar o width / height da tag object para algo maior e você vai ver o player associado ao plugin do audio escolhido.

 

Veja também que ao clicar no Stop, ocorre uma ruptura no fluxo do plugin pois você "some" com algo de que ele necessita, e para indicar isso o ícone muda.

 

Como você quer só os botões, deixando com 1 de altura e 1 de largura, você não vês omplayer, só os botões.

 

O arquivo MIDI que eu peguei, da Família Adams, peguei aqui

 

Testei no Chrome e no Firefox apenas. O Firefox aceitou de boa, o Chrome reclamou que meu QuickTime estava desatualizado e nem tentei atualizar.

Compartilhar este post

Link para o post
Compartilhar em outros sites

webdevelopermgri    0

webdevelopermgri
Postado

Ola, bom dia Bruno,

Seu script é muito bacana, mas me expressei muito mal em meu post, o botão que tenho é uma imagem única com um rollover e o que preciso é ao clicar nessa imagem o som inicie e o clicar novamente ele pare, tentei fazer umas modificações mas não consegui algo parecido.

Se puder me ajudar, mais uma vez, agradeço.

Valeu e fiquem na paz.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito