Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

103
Visualizações
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 Respostas
Responde à pergunta

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 Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda