1

Hola necesito ayuda con un video, lo que quiero es que al finalizar que ejecute una función con javascrip, quiero que al finalizar el video le pueda dar la clase de d-none y remover la clase d-none de las imagenes que antes, necesito que esta así en autoplay y sin controles

<div class="d-none" id="mi-image">
 <img src="/static/images/Head-Video1.png" alt="" class="d-none d-sm-block img-header">
 <img src="/static/images/movil-2.jpg" alt="" class="d-sm-none img-header">
</div>
<video id="video" class="imagen-fondo" autoplay muted poster="/static/images/Head-Video1.png" >
  <source src="static/videos/Herbalife_Greek_Cruise_Teaser_V4.mp4" type="video/mp4">
  <source src="static/videos/mov_bbb.ogg" type="video/ogg">
  <img src="static/images/Head-Video1.png" alt="" class="imagen-fondo">
  <img class="imagen-logo" src="static/images/Logo-Intro.png">
</video>`
1

1 respuesta 1

2

Para hacer lo que necesitas, sería algo así:

<script type='text/javascript'>
    document.getElementById('video').addEventListener('ended', handlerVideo, false); //Agregar un listener para detectar cuando termina el video y mandarle la función que debe de ejecutar en ese instante

    function handlerVideo(e) {
        var elemento_video = document.getElementById("video"); //Obtener elemento
        elemento_video.classList.add("d-none"); //Agregar clase

        var div_img = document.getElementById("mi-image"); //Obtener elemento
        div_img.classList.remove("d-none"); //Quitar clase
    }
</script>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.