entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

1voto

COMO RETORNAR AL BOTÓN PLAY HTML JS

Hola amigos, buenas, he buscado por todos lados una solución a mi inconveniente pero hasta ahora no logro conseguir. Estoy creando mi página de música (dj) y he insertado reproductor de un solo botón (solo play y pause). Al darle play la música suena y el botón se convierte en pause, y cuando le doy pause se convierte en play, todo bien hasta entonces, el detalle está en que cuando termina la música el botón no se convierte en play, es decir se queda en icono de pause.

<div id="music-demo-play">
    <div id="audio-demo-1">
    <iframe src="demo/audio1/audio1.html"></iframe>
        </div>
</div>

Se encuentra en iframe porque tengo varios audios y me funciona bien esto.

Este es el código del botón:

    <audio class="audio1" src="onelovedemo96.mp3" preload="auto">
        Tu navegador no soporta el elemento <code>audio</code>.
    </audio>
    <button id="boton1"><i class="fas fa-play"></i></button>
        <script type="text/javascript">
                    var v = document.getElementsByClassName("audio1") [0]; 
        var sound = false;

        var boton = document.getElementById("boton1");
        boton.addEventListener("click", function(){
            if (!sound) {
                v.play();
                this.innerHTML="<i class=\"fas fa-pause\">";
                sound = true;
            } else {
                v.pause();
                this.innerHTML="<i class=\"fas fa-play\">";
                sound = false;
            }
        });
    </script>

Gracias de antemano por sus ayuda.

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta