如何覆盖图像/视频上的文字？

我们需要在网页中的对象上放置文本，类似于：http://www.queness.com/resources/html/slideshow/jquery-slideshow.html 如何覆盖图像/视频上的文字？

文本“栏”需要出现在图像和视频之上。对于视频，我们使用html5media库（http://code.google.com/p/html5media/），它为支持它的浏览器呈现<video>标签，或为其他人提供Flowplayer。

你如何用jQuery做到这一点？视频甚至可能吗？有一些例子，但没有一个允许文字在<video>或Flowplayer对象之上。谢谢。

2010-04-14 Alex

顶端为的Flowplayer你应该设置'wmode'到'transparent'或'opaque' – 2010-04-14 18:55:37

感谢。这有点复杂：我还使用jQuery Background Canvas库，它将canvas对象放入组合中。将'wmode'设置为'transparent'，IE6可以让你通过视频播放器看到画布 - 就像它上面有一层面纱。 – Alex 2010-04-14 19:17:51

您必须的wmode =不透明您的Flash对象，以便能够把HTML在它

来源

2010-04-14 19:43:03 XGreen

谢谢，XGreen和dev-null-dweller。这适用于除IE6（和更低版本）以外的所有浏览器 - 我知道为什么：这是来自jQuery Background Canvas库的CANVAS对象，用于为容器DIV创建透明度和圆角。在IE6上，您会看到一个阴天的视频，因为CANVAS位于顶部或以某种方式干扰了不透明的视频。 – Alex 2010-04-14 20:43:30

顺便说一下，对于那些有兴趣在Flowplayer中添加opaque参数的人，您需要将其添加到Flowplayer JavaScript库文件中的以下变量中：var i = {width：“100％”，height：“100％”， allowfullscreen：true，wmode：“opaque” allowcriptaccess：“always”，quality：“high”，version：null，onFail：null， expressInstall：null，w3c：false，cachebusting：false} – Alex 2010-04-14 20:46:38

我真的认为我们程序员应该开始在我们的页面中包含以下代码： if（$。browser.msie && $ .browser.version ==“6.0”）alert（“对不起，如果你还没有更新，你最好忘了网页“）; :) – XGreen 2010-04-14 20:59:17

您是否尝试过使用透明背景的文本进行绝对定位？

来源

2010-04-14 18:46:58 Jay

是的，但文字在下面。 – Alex 2010-04-14 19:14:20

您是否将z-index css属性设置为置顶？ – Jay 2010-04-15 14:14:03

如何覆盖图像/视频上的文字？

回答

相关问题