Javascript将图像与视频一起移动到其他div [英] Javascript move image together with video to other divs

问题描述

在我提问如何从一个视频移动视频div到另一个。
现在，我还有一个问题。我想在每个视频上附加一个图像（实际上，我希望在每个视频前都有一个图像），并将其与视频一起移动。

我没有在这里粘贴我的代码，而是制作了一个可以清除所有问题的 JSBIN DEMO 。
这样做的可能性有多大？任何人都可以帮助我？

---编辑----
我有视频，它们被移动到其他< div> ;鼠标点击 s。此外，我还希望在这些视频上附加一些图标，以便原始< div> s中的图像可以移至另一个< div> / code> s在点击视频时点击鼠标点击。尝试将图像和视频放入div中一起移动div而不仅仅是视频。可能与

一致

 < div style =height：100; width：100; position：relative;>>> ; 
< source src =movie.mp4type =video / mp4style =position：absolute; z-index：1;> 
< img src =image.jpgstyle =position：absolute; z-index：2;> 
< / div> 
  

使用Z-index将视频隐藏在div中的图像后面，然后使用javascript或jquery点击更改z-index变量。

Before I asked a question how to move videos from one div to another. Now, I have another problem. I want to "attach" an image on each video (actually, I would like to have an image in front of each video) and make it moving together with video.

Instead of pasting my code here, I made a working JSBIN DEMO which could clear the things out. Any possibility of doing this? Anyone could help me?

--- EDIT ---- I have videos, which are moved to other <div>s on mouseclick. Also I want to attach some icons on these videos, so that the images from original <div>s would move to another <div>s together on mouse click when video is clicked.

解决方案

Try placing the image and video into a div together and move the div rather than just the video. Maybe something along the lines of

<div style="height:100;width:100;position:relative;">
   <source src="movie.mp4" type="video/mp4" style="position:absolute;z-index:1;">
   <img src="image.jpg" style="position:absolute;z-index:2;">
</div>

Use the Z-index to hide the video behind the image in the div, then use javascript or jquery to onclick change z-index variable.

这篇关于Javascript将图像与视频一起移动到其他div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！