gpt4 book ai didi

javascript - 如何在 div 背景上显示视频?

转载 作者:行者123 更新时间:2023-11-28 16:02:28 24 4
gpt4 key购买 nike

谁能帮我把视频放在网站背景上?视频源来自 Vimeo ... 我使用 iframe,我将视频设置为 src

<iframe src="https://player.vimeo.com/video/45628635?loop=1&background=1" width="100%" height="500px" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

我需要的状态你可以在图片上看到 enter image description here

最佳答案

给 iframe 标签一个自己的类,把它放在父容器中,像这样。

<div class="container">
<iframe class="vid" src="https://player.vimeo.com/video/45628635?loop=1&background=1" width="100%" height="500px" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div>

然后使用 CSS 变换按比例放大视频,将容器宽度设置为 100%,高度设置为 500px,并 overflow hidden 部分。

.vid{
transform: scale(2.5);
}

.container{
width: 100%;
height: 500px;
overflow: hidden;
}

并将溢出隐藏在这个“容器”div 所在的任何对象上。

关于javascript - 如何在 div 背景上显示视频?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39852936/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com