使用js和jq滚动播放和暂停两个或多个视频的代码

<div class="video-container">
  <video id="video1" src="video1.mp4"></video>
  <video id="video2" src="video2.mp4"></video>
</div>

$(document).ready(function() {
  var videos = $('.video-container video'); // 获取所有视频元素

  // 滚动时检测视频是否在可视区域内
  $(window).scroll(function() {
    checkVideoInView();
  });

  // 初始化时检测视频是否在可视区域内
  checkVideoInView();

  // 检测视频是否在可视区域内
  function checkVideoInView() {
    var windowHeight = $(window).height(); // 窗口高度
    var windowTop = $(window).scrollTop(); // 窗口顶部位置
    var windowBottom = windowTop + windowHeight; // 窗口底部位置

    videos.each(function() {
      var video = $(this);
      var videoTop = video.offset().top; // 视频顶部位置
      var videoBottom = videoTop + video.height(); // 视频底部位置

      // 判断视频是否在可视区域内
      if ((videoTop >= windowTop && videoTop <= windowBottom) || (videoBottom >= windowTop && videoBottom <= windowBottom)) {
        playVideo(video); // 播放视频
      } else {
        pauseVideo(video); // 暂停视频
      }
    });
  }

  // 播放视频
  function playVideo(video) {
    video.get(0).play();
  }

  // 暂停视频
  function pauseVideo(video) {
    video.get(0).pause();
  }
});