Question

我正在研究fiddle，在其中我要在html / js（jquery）中的可拖动/可调整大小的图像后面运行youtube视频。

我想要的是可拖动/可调整大小的图像，该图像应保留在youtube视频的顶部。

我用来制作可拖动和可调整大小的图像的HTML和Javascript代码是：

HTML：

<div id="wrapper" style="display:inline-block"> <img id="image" src="http://www.google.com.br/images/srpr/logo3w.png" /> </div>

Javascript / Jquery：

$(function() { $('#wrapper').draggable(); $('#image').resizable(); });

问题陈述：

我想知道我应该在上面的小提琴中进行哪些更改，以便可以在其后面放置一个youtube视频。

这是我在CSS中尝试过的方法，但是似乎不起作用：

#wrapper { background: url('https://www.youtube.com/watch?v=EtEukxu6hu0') center center no-repeat; }

Answer 1

您可以尝试将其用于HTML

<div style="position: fixed; z-index: -99; width: 100%; height: 100%">
    <iframe frameborder="0" height="100%" width="100%" src="https://youtube.com/embed/YOUR_YOUTUBE_VIDEO_ID?autoplay=1&controls=0&showinfo=0&autohide=1">
    </iframe>
</div>
<div id="wrapper" style="display:inline-block">
    <img id="image" src="http://www.google.com.br/images/srpr/logo3w.png" />
</div>

更新的小提琴-https://jsfiddle.net/qpeehsxn/24/

如何在html / js中的图像后面运行youtube视频？

1 个答案: