嵌入 wmv 在 Chrome 中隐藏下拉/浮动对象
我尝试了在网络上找到的许多技巧,包括:
- wmode 透明
- z-index
- WindowlessVideo
但它们似乎都不适用于 Chrome。在 IE 和 FF 上运行良好。
此版本的代码符合 XHTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>wmv embed test</title>
<style type="text/css">
#floatingbar { background: thistle; z-index: 9999; position: absolute; width: 500px; height: 60px; border: 1px solid blue; }
#floatingbar2 { background: white; z-index: 9999; position: absolute; width: 500px; height: 60px; border: 1px solid orange; top: 140px; }
</style>
</head>
<body>
<div id="floatingbar"></div>
<object type="application/x-mplayer2" style="width:260px; height:200px;" data="http://nov-exl.com/test/FactFinders.wmv">
<param name="movie" value="http://nov-exl.com/test/FactFinders.wmv" />
</object>
<div id="floatingbar2"></div>
</body>
</html>
I've tried many tricks found on the web including:
- wmode transparent
- z-index
- WindowlessVideo
But none of them seem to work on Chrome. Works fine on IE and FF.
This version of code is XHTML compliant:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>wmv embed test</title>
<style type="text/css">
#floatingbar { background: thistle; z-index: 9999; position: absolute; width: 500px; height: 60px; border: 1px solid blue; }
#floatingbar2 { background: white; z-index: 9999; position: absolute; width: 500px; height: 60px; border: 1px solid orange; top: 140px; }
</style>
</head>
<body>
<div id="floatingbar"></div>
<object type="application/x-mplayer2" style="width:260px; height:200px;" data="http://nov-exl.com/test/FactFinders.wmv">
<param name="movie" value="http://nov-exl.com/test/FactFinders.wmv" />
</object>
<div id="floatingbar2"></div>
</body>
</html>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
如果您只想裁剪视频,可以将其放在 div 标签中,并将溢出设置为隐藏。像这样的事情:
如果您想要为您的视频提供更多自定义边框或其他内容,那么在 Chrome 中您可能会不走运。
If you just wanted to crop the video, you could put it in a div tag with overflow set to hidden. Something like this:
If you wanted a more custom border or something for your videos, you might be out of luck when it comes to Chrome.