如何在浏览器中启用嵌入式视频对象拖动(即YouTube视频)

Question

如何启用在网页上拖动<embed>对象(使用javascript)？通常，当我在网页上选择一些文本或图像时，我可以将其拖来拖去，并且我希望对对象执行同样的操作。

具体地说，我希望能够拖动YouTube视频。我现在不担心丢弃，而且如果可能的话，我也不想使用jQuery UI。YouTube嵌入器如下所示

<embed id="movie_player" ... type="application/x-shockwave-flash" />

我正在编写一个浏览器扩展(用于Chrome)，因此我可以完全访问DOM和浏览器。

Answer 1

我认为jQuery在这里是最好的，它也是javascript，你所要做的就是将它嵌入到你的网站中。如果您想要一个半透明的效果来查看您正在拖动的对象，我认为您可以为拖动手柄添加一个事件。使用onMouseDown和onMouseUp。例如，这个div是处理您的youtube:透明的CSS是：

opacity: .7; filter:Alpha(Opacity=70);，0.7和70是元素的不透明度百分比！

示例

<div onMouseDown="this.style.opacity='0.7'; this.style.filter='Alpha(Opacity=70)';" onMouseUp="this.style.opacity='1.0'; this.style.filter='Alpha(Opacity=100)';"><br><embed something here></embed></div>。

好吧，如果你以某种方式改变了主意，想要使用jQuery，试一试吧，我保证这非常容易！

首先，将此代码嵌入到您的网站中：

<script src="http://code.jquery.com/jquery-1.5.1.min.js"></script><script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js"></script>

<script language="javascript" type="text/javascript">$(document).ready(function(){$(".drag").draggable();});</script>

其次，给任何你想要拖拽的类" drag "，在本例中：

<div class="drag">YOUR YOUTUBE VIDEO EMBED HERE</div>

将它与半透明效果一起使用，我认为所有你需要的，我希望这对你有所帮助。

xx3004，