Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

107
Vistas
Javascript start video again after time

i have e video that i am playing by scrolling with my mousewheel. Everything is working fine but i would like to check if the video has finished and jump back to the beginning.

I have tried a if statement setting all variable back to 0 but it is not working. This is my code so far with the non working if statement:

const action = document.querySelector(".action");
const video = action.querySelector("video");

//Scroll Magic scenes
const controller = new ScrollMagic.Controller();
let scene = new ScrollMagic.Scene({
  duration: 200000, //64000
  triggerElement: action,
  triggerHook: 0
})
//  .addIndicators()
  .setPin(action)
  .addTo(controller);

//Scroll Magic video animation
let accelAmount = 0.1;
let scrollpos = 0;
let currentTime = video.currentTime;
let lastcurrentTime;
let delay = 0;

scene.on("update", e => {
  scrollpos = e.scrollPos / 3000; //the higher the number, the slower
  });

//Move
  setInterval(() => {
    delay += (scrollpos - delay) * accelAmount;
    video.currentTime = delay;
    console.log(video.currentTime + " reading");
    lastcurrentTime = video.currentTime;
  }, 33.3);

//function to check if is still scrolling
function scrollTracker(delay, callback) {
  let timeout = null;

  return function(...args) {
    if (timeout !== null) {
      clearTimeout(timeout);
      timeout = null;
    }

    timeout = setTimeout(callback, delay, ...args)
  };
}

//check if is still scrolling after x seconds
const tracker = scrollTracker(5000, () => {
  console.log('User stopped scrolling.');
  window.scrollTo(0, 0);
});

window.addEventListener('scroll', tracker);

//scroll back to beginning when movie has finished -- not working
if (video.currentTime >= 100.0){
  window.scrollTo(0, 0);
  scrollpos = 0;
  currentTime = 0;
  delay = 0;
}

Thanks for any help!

P.S. Is there a way to jump back to beginning of the video other then by using "window.scrollTo"?

video.currentTime = 0; is not working here.

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Add a loop attribute to the video element and it will loop for us automatically. The if doesnt work beacause it only checks once when the code is ran. You need the end event listener to check.

https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/ended_event

https://www.w3schools.com/tags/att_video_loop.asp

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda