wordpress - 如何更改帖子中的属性 "autoplay"

Question

我有一个问题，我的 WordPress 博客嵌入了来自 Imgur 的视频。加载后会自动播放。它还会自动循环。它与此嵌入 HTML 完美配合。但是，当我们将其滚动出屏幕时，它并不会停止。滚出时如何停止？谢谢

<center><video style="max-width: 100%; height: auto;" preload="auto" autoplay="autoplay" loop="loop" controls="controls" width="450" height="auto"><source src="https://i.imgur.com/84FAg6j.mp4" /></video></center>

Answer 1

我刚刚将 id 添加到视频标签，并且刚刚使用了 jQuery 基于滚动位置的播放和暂停选项。希望这会对您有所帮助。

var sec_position = $('#sec').offset().top;
var vid = document.getElementById('video');
$(window).on('scroll', function() {
  var window_position = window.pageYOffset;
  if (sec_position < window_position) {
    vid.pause();
  } else {
    vid.play();
  }
});

#sec {
  height: 500px;
  background: red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<center><video id="video" style="max-width: 100%; height: auto;" preload="auto" autoplay="autoplay" loop="loop" controls="controls" width="450" height="auto">
    <source src="https://i.imgur.com/84FAg6j.mp4" /></video></center>
<div id="sec"></div>