CSS：如何在同一页面上有多个固定背景视频

Question

自从引入了“background-attachment：fixed”属性后，我们就可以在同一页面的不同位置放置多个固定背景，这给出了非常酷的效果。

然而，据我所知，视频背景没有这个美妙的属性，而是依靠老派的“位置：固定”来相对于屏幕固定。但我不能在同一页面上有两个全屏“position:fixed”元素，可以吗？谁的 z-index 较高，谁就是唯一可见的。

有什么办法可以克服这个问题吗？ （也许 jquery 解决方案，如果 CSS 不允许？）

这是我的 HTML：

<video autoplay muted loop id="video_1">
  <source src="video-1.mp4" type="video/mp4">
</video>

<div class="textbox">
  Here's some content
</div>

<video autoplay muted loop id="video_2">
  <source src="video-2.mp4" type="video/mp4">
</video>

和CSS：

video {
  position: fixed;
  right: 0;
  top: 0;
  min-width: 100%;
  min-height: 100%;
}

非常感谢。

Answer 1

Ich arbeite auch gerade dran。我知道 Javascript 是这样的。 Seit 稳定扩散 gibt das schöne effekte。