jQuery-自动滚动播放HTML5视频如果点击了视频，请不要滚动播放

编程问答 2022-06-13

问题描述

我正在尝试建立一个jquery脚本，当它滚动到视图中时会在页面上播放视频，而在滚动时会暂停。目前有效！ （附件的代码是在网上找到的）

问题在于，如果用户暂停视频并滚动一点，视频将再次启动。 有没有一种方法可以将检查视频是否曾经被点击的选项添加到当前代码中？在这种情况下，不会自动播放。

这是我当前的代码：

$(document).ready(function() {
     var media = $('video').not("[autoplay='autoplay']");
     var tolerancePixel = 40;
     function checkMedia(){
      var scrollTop = $(window).scrollTop() + tolerancePixel;
      var scrollBottom = $(window).scrollTop() + $(window).height() - tolerancePixel;
      media.each(function(index,el) {
       var yTopMedia = $(this).offset().top;
       var yBottomMedia = $(this).height() + yTopMedia;
       if(scrollTop < yBottomMedia && scrollBottom > yTopMedia){ 
        $(this).get(0).play();
        } else {
           $(this).get(0).pause();
           }
       });
      }
     $(document).on('scroll',checkMedia);
    });

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

htmljavascriptjqueryvideovideo