Bom dia, Pessoal.
Tudo bem?
Preciso trocar uma imagem depois de um clique.
A minha ideia é manter a imagem nova no mesmo lugar da anterior depois do clique, mas com o "onclick" ativo para eu poder clicar na imagem de novo e a primeira imagem reaparecer no lugar da segunda.
Outro detalhe estou com uma programação que corta volume de um vídeo ativo no "button onclick", que esta funcionando e não pode parar de funcionar. Do jeito que eu configurei o "button onclick" do vídeo não parou de funcionar, mas a imagem não muda.
Tem como alguém me dar um help? Javascript:
<script type="text/javascript">
function mudaImagem(i) {
if (i == 1) {
document.getElementById("imagem1").src="img/volume.jpg", 'style="display:block;"';
document.getElementById("imagem2").src="img/mute.jpg", 'style="display:none;"';
} else if (i == 2) {
document.getElementById("imagem1").src="img/mute.jpg", 'style="display:block;"';
document.getElementById("imagem2").src="img/volume.jpg", 'style="display:none;"';
}
}
</script>
HTML:
<button onclick="jQuery('#bgndVideo').toggleVolume()" ><img src="img/volume.jpg" alt="Som" id="imagem1" onclick="mudaImagem(1)" style="display:block;"/><img src="img/mute.jpg" alt="Som" id="imagem2" onclick="mudaImagem(2)" style="display:none;" /></button>