html鼠标滚轮控制同一页面上下切换不同视频

要实现同一页面上下切换不同视频，您可以使用HTML5的video标签和JavaScript来实现。具体实现步骤如下：

1. 在HTML中创建video标签，并设置id和src属性，src属性为视频文件的URL。

<video id="video1" src="video1.mp4"></video>
<video id="video2" src="video2.mp4"></video>

2. 在JavaScript中获取video元素，并添加滚动事件，根据滚动方向切换不同的视频。

var video1 = document.getElementById("video1");
var video2 = document.getElementById("video2");

window.addEventListener("wheel", function(e) {
  if (e.deltaY > 0 && video1.paused) {
    video1.play();
  } else if (e.deltaY > 0 && !video1.paused) {
    video1.pause();
    video2.play();
  } else if (e.deltaY < 0 && !video2.paused) {
    video2.pause();
    video1.play();
  }
});

3. 在CSS中设置video元素的样式，使其覆盖整个页面，并设置z-index属性，使其在最上层。

video {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 9999;
}

通过上述步骤，您就可以实现同一页面上下切换不同视频的效果了。