Воспроизвести аудио элемент только один раз, когда он находится в окне просмотра - PullRequest
Новая
       17

Воспроизвести аудио элемент только один раз, когда он находится в окне просмотра

0 голосов
/ 16 апреля 2020

Я создаю страницу, на которой несколько звуковых файлов входят и выходят из окна просмотра при прокрутке. Они играют только тогда, когда они находятся внутри области просмотра. Пока это работает, но когда звук остановился и вы снова прокрутите его, он снова начнет воспроизводиться. Я хочу предотвратить это и воспроизводить звук снова, только когда он впервые покинул область просмотра и снова вошел.

Эта часть проверяет, закончился ли звук 

document.querySelectorAll('.audioplayer').forEach((track) => {
  track.addEventListener("ended", function(){
    this.classList.add('ended');
  })
});

, и эта часть для моего автозапуска 

$(window).scroll(function() {
   $('.audioplayer').each(function(){
       if ($(this).isInViewport() && !$(this).hasClass('ended')) {
           $(this)[0].play();
       } else {
           $(this)[0].pause();
           $(this)[0].className = 'audioplayer';
           $(this)[0].currentTime = 0;
       }
   })
});

Я не могу понять, почему он не работает

...