如何将可点击图像放在网页上的QuickTime视频上?

时间:2011-01-26 23:52:52

标签: javascript jquery video quicktime

我有一个在WordPress上运行的网站。标题中有一个DIV,其中包含一个嵌入的QuickTime视频(控件已关闭,需要保持这样)。我有一个应该覆盖视频的图像,当用户点击它时,视频应该显示并播放。

我认为,如果我把CSS和Javascript弄乱了很长时间,我可以让图像消失并在点击时陶醉嵌入的视频,但我不知道如何使视频开始“onclick”事件。另一个注意:我更喜欢使用jQuery来做这件事,因为那是我通常使用的。但无论什么工作都有效。

这让我发疯,因为我找不到有关如何做到这一点的任何好消息!非常感谢你提前帮助我。

2 个答案:

答案 0 :(得分:0)

如果您已有包含视频的DIV,则可以创建另一个包含图像的相同大小的DIV。最后,将图像DIV设置为更高z-index并将其浮动到视频DIV上。

我认为这应该有用。

答案 1 :(得分:0)

使用QuickTime插件渲染视频时,确实没有好办法。插件针对性能进行了优化,通常呈现在页面中其余“本机”元素之上。

我似乎记得最近在插件中引入的wmode =“transparent”属性或“opaque”类似于Flash插件所使用的属性,但性能通常会受到影响,因为插件渲染器通常需要切换在软件中进行渲染,因为它将视频与您在其上面的元素进行合成,并且可能还包含在其下方的元素。

最简单的方法是使用视频元素在您的网页上播放您想要的媒体。此时,它与页面上的任何其他元素一样,并与定位元素的z-index顺序无缝交互。

使用示例如下:http://dev.opera.com/articles/view/introduction-html5-video/

您可能需要将不同编码的视频嵌套为页面中的视频元素,以便支持不同代码的各种用户代理可以播放视频。但是只需添加视频元素并将其指向当前的QuickTime视频,就像使用QT插件的简单对象一样。