如何在网页上的 QuickTime 视频上放置可点击的图像？
我有一个在 WordPress 上运行的网站。标头中有一个 DIV，其中包含嵌入的 QuickTime 视频（控件已关闭，需要保持这种状态）。我有一个应该覆盖视频的图像，当用户单击它时，应该显示并播放视频。
我认为，如果我在 CSS 和 Javascript 上搞砸了足够长的时间，我可以让图像消失并在点击时欣赏嵌入的视频，但我不知道如何让视频在同一个“onclick”上开始事件。这里还有一个注意事项：我更喜欢使用 jQuery 来执行此操作，因为这是我通常使用的方法。但凡有效的都有效。
这让我发疯，因为我找不到任何关于如何做到这一点的好信息！预先非常感谢您对我的帮助。
I have a website that runs on WordPress. There is a DIV in the header that contains an embedded QuickTime video (controls are turned off and need to stay like that). I have an image that is supposed to go over the video, and when the user clicks on it, the video should be revealed and play.
I think that if I messed around with the CSS and Javascript for long enough, I could make the image go away and revel the embedded video when clicked on, but I don't know how to make the video start on that same "onclick" event. Another note here: I prefer to use jQuery to do this, since that's what I usually work with. But whatever works works.
This is driving me crazy because I can't find any good information on how to do this! Thank you so much in advance for helping me out.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
如果您已经有一个包含视频的 DIV，则可以创建另一个包含图像的相同大小的 DIV。最后，将图像 DIV 设置为较高的 z-index 并将其浮动在视频上DIV。
我认为这应该有效。
If you already have a DIV that contains the video, you can create another same-sized DIV that contains your image. Finally, set the image DIV with higher z-index and float it over the video DIV.
I think this should work.
使用 QuickTime 插件渲染视频时确实没有什么好方法来做到这一点。插件针对性能进行了优化，通常呈现在页面中其余“本机”元素之上。
我似乎记得最近在插件中引入了一个 wmode="transparent" 属性或“opaque”，类似于 Flash 插件使用的属性，但性能通常会受到影响，因为插件渲染器经常需要切换到渲染软件，因为它将视频与视频上方的元素以及下方的元素进行合成。
最简单的方法就是使用视频元素在页面上播放您想要的媒体。此时，它是一个与页面上任何其他元素一样的元素，并且与定位元素的 z-index 顺序无缝交互。
用法示例如下： http://dev.opera.com/ articles/view/introduction-html5-video/
您可能需要将不同编码的视频作为视频元素嵌套在页面中，以便支持不同代码的各种用户代理可以播放视频。但是，只需添加视频元素并将其指向当前的 QuickTime 视频，就可以像使用 QT 插件的简单对象一样工作。
There's really no good way to do this when rendering the video using the QuickTime plugin. Plugins are optimized for performance and typically render above the rest of the "native" elements within your page.
I seem to recall there's a wmode="transparent" attribute or "opaque" that was introduced recently to the plugin similar to what's used with the Flash plugin, but the performance will typically suffer because the plugin renderer will often need to switch to rendering in software as it composites the video with the element you have on top of it, and possibly elements beneath it as well.
The easiest thing to do is to simply use a video element to play the media you want on your page. At that point it is an element like any other on the page and interacts seamlessly with the z-index ordering of positioned elements.
An example of the usage is here: http://dev.opera.com/articles/view/introduction-html5-video/
You may need to nest differently encoded videos as video elements in the page so various user agents with support for different codes can play the video. But just adding the video element and pointing it at your current QuickTime video will work as well as a simple object using the QT plugin.