Ir para conteúdo

POWERED BY:

Arquivado

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

Lucaascrazy

Executar Som ao clicar , problemas

Recommended Posts

Olá galerinha do javascript !

 

Seguinte .. não sou muito bom com javascript, mas faço o que posso .rs

Fiz um sistema de som para executar ao abrir a pagina e queria aprimorar ele.

 

É mais ou menos assim ..

 

Ao clicar em algum link ele executa um audio.

Bom, fiz da seguinte maneira :

<script type="text/javascript">
$("#teste").live('click', function() {
  audio();
});
</script>

 

e no HTML :

<a href="#"><div id="teste">teste</div></a>

 

E a função para executar o audio

function audio(){
var soundsrc = "som.wav";
if ( navigator.userAgent.toLowerCase().indexOf("firefox") != -1 ) {
document.write('<object data="'+soundsrc+'" type="application/x-mplayer2" height="0" width="0">');
document.write('<param name="filename" value="'+soundsrc+'">');
document.write('<param name="autostart" value="1">');
document.write('</object>');}
else {
document.write('<audio src="'+soundsrc+'" autoplay>');
document.write('<object data="'+soundsrc+'" type="application/x-mplayer2" height="0" width="0">');
document.write('<param name="filename" value="'+soundsrc+'">');
document.write('<param name="autostart" value="1">');
document.write('<embed src="'+soundsrc+'" pluginspage="http://www.apple.com/quicktime/download/" height="0" width="0 type="video/quicktime" autoplay=true>');
document.write('</embed></object>');
document.write('</audio>');}
};

 

Beleza ..

 

Após eu clicar no botao(link), ao invés de ele continuar na pagina que está ( por exemplo: contato.php ), a página fica em branco e o audio é executado.

 

Repetindo :

 

Cliquei -> Página fica em branco > Executa o audio normalmente.

 

Como que eu resolvo para, apos clicar nao sair da pagina ou nao ficar branca ?

Espero que vocês me ajudem !

Obrigado a todos !

Compartilhar este post


Link para o post
Compartilhar em outros sites

não use o document.write()

 

use um:

document.getElementById('id_do_elemento_que_vai_receber_o_audio').innerHTML = 'seu embed';

ainda assim, com html5, vc poderia usar a TAG <audio>, e fazer isso de uma forma muito mais bonita.

Não tenho exemplos, mas é fácil achar no google.

Compartilhar este post


Link para o post
Compartilhar em outros sites

 

não use o document.write()

 

use um:

document.getElementById('id_do_elemento_que_vai_receber_o_audio').innerHTML = 'seu embed';

ainda assim, com html5, vc poderia usar a TAG <audio>, e fazer isso de uma forma muito mais bonita.

Não tenho exemplos, mas é fácil achar no google.

 

Olá e obrigado por responder ..

Entao ontem fiquei 24hrs vendo e nao encontrei nada ..

E essa funcao funciona para todos os navegadores (Google Chrome,Firefox e IE) perfeitamente ..

Ja o <audio> html5 nao .. so consegui rodar no google chrome e ie e nao me engano..

Mas entao, eu nao entendi muito bem o que você quis dizer

 

 

"document.getElementById('id_do_elemento_que_vai_receber_o_audio').innerHTML = 'seu embed';"

 

pois como eu varia para executar depois como eu quero?

Porque eu executo o audito desta forma (quando é audio background)

 

<script type="text/javascript">audio();</script>

 

e funciona tranquilo .. só estou tendo problemas nesse de quando eu vou clicar ..

 

Se puder fazer um exemplo com os arquivos que eu fiz .. agradeceria muito

 

Obrigado e desculpa qualquer erro meu, pois como eu disse .. nao sou muito bom com javascript ^^

 

 

#Edit

 

Bom, ficar parado esperando ajuda de maos beijadas é que nao vou ..

Segui o que vc falou e rodou certinho, mas pq ao clicar no link, o texto ou imagem some e depois que o audio termina ele volta ?

Teria como, fazer com que ele nao sumisse

e mais uma coisa, o <audio> nao funfa em todos os navegadores .. o que eu faço?

 

Fiz da seguinte maneira

<script type="text/javascript">
	$("#teste").live('click', function() {
		document.getElementById('teste').innerHTML = '<audio src="audio.wav" autoplay></audio>';
	});
</script>

 

e no html

<a href="#"><div id="teste">Teste</div></a>

 

 

Testa ai e ve .. :D

Aguardo respostas

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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