滚动播放视频在除 Firefox 之外的所有浏览器中都很流畅

如何解决滚动播放视频在除 Firefox 之外的所有浏览器中都很流畅

当按下 #button 时，视频会使用 currentTime 根据滚动位置播放。视频正确编码，关键帧间隔为 1，因此搜索不是问题。视频在所有浏览器中都能流畅播放，除了 Firefox 非常缓慢/断断续续，我不知道为什么。

使用滚动条或鼠标滚轮播放视频很流畅。然而，按下 #button 就会出现延迟。

我已经为此苦苦挣扎了几天，因此我们将不胜感激。

$(document).ready(function () {
  var intro = $("#intro");
  var vid = $('#v0');
  var checkOnce = false;
  vid[0].load();
  
  vid.on('loadeddata',function () {
    // get height of each section text
    intro.children().each(function (index) {
      // insert next and prev buttons
      if (intro.children().length - 1 !== index) {
        $(this).find('span').append("<button id='button' class='btn btn-primary' data-position=" + (index + 2) + ">Next</button>");
      } else {
        $(this).find('span').append("<button id='button' class='btn btn-primary' data-position='end'>Next</button>");
      }
    });

    // required to remove the fixed height
    intro.css('marginBottom',vid.height());
  });

  $(window).scroll(function () {
    vid[0].currentTime = (window.pageYOffset / (intro.height() / 10));
    console.log(vid[0].currentTime);
    
    if ($(window).scrollTop() >= intro.offset().top + intro.outerHeight() - window.innerHeight + vid.height()) {
      if (checkOnce == false) {
        vid.css('position','relative');
        intro.css('marginBottom',0);
        checkOnce = true;
      }
    } else {
      if (checkOnce == true) {
        intro.css('marginBottom',vid.height());
        vid.css('position','fixed');
        checkOnce = false;
      }
    }
  });

  $(document).on('click','#button',function (event) {
    event.preventDefault();

    if ($(this).attr('data-position') === 'end') {
      $('html,body').animate({
        scrollTop: $(".end").offset().top
      },1500);
    } else {
      $('html,body').animate({
        scrollTop: $(".section" + $(this).attr('data-position')).offset().top
      },1500);
    }
  });
});