chrome里面的flash视频超出了div,div上加了border-radius属性
我写了一个div,里面有一个flash视频,我想做成上边俩角是圆的,于是用了css3的border-radius属性,firefox里面很正常,视频变成圆角的样子了,可是在chrome里面却不行,flash视频超出去了。。
下边是我的代码:
CSS:
#player { -webkit-border-radius: 80px 80px 0 0; -moz-border-radius: 80px 80px 0 0; border-radius: 80px 80px 0 0; border: 2px solid #CCC; text-decoration: none; z-index: 10; width: 400px; height: 400px; margin: 0 auto; overflow: hidden; } #player object { z-index: -10; position: relative; }
HTML:
<div id="player"> <object width="100%" height="100%" id="movie_player" wmode="transparent" data="http://static.youku.com/v1.0.0310/v/swf/loader.swf" type="application/x-shockwave-flash"> <param name="quality" value="high"> <param name="wmode" value="transparent"> <param value="true" name="allowFullScreen"> <param value="always" name="allowscriptaccess"> <param value="VideoIDS=XNTI5NDEyNDg0&ShowId=0&category=91&Cp=0&Light=on&THX=off&unCookie=0&frame=0&pvid=1363768524981SFC&Tid=0&isAutoPlay=true&Version=/v1.0.0844&show_ce=0&winType=interior&Type=Folder&Fid=19053499&Pt=0&Ob=1&plchid=a&embedid=AjEzMjM1MzEyMQJ3d3cueW91a3UuY29tAi8=&vext=bc%3D%26pid%3D%26unCookie%3D0%26frame%3D0%26type%3D1%26fob%3D1%26fpo%3D0%26svt%3D0%26emb%3DAjEzMjM1MzEyMQJ3d3cueW91a3UuY29tAi8%3D%26dn%3D%E7%BD%91%E9%A1%B5%26hwc%3D1%26mtype%3Doth" name="flashvars"> <param value="http://static.youku.com/v1.0.0310/v/swf/loader.swf" name="movie"> <div class="player_html5"> <div style="height:100%" class="picture"> <div style="line-height:460px;"> <span style="font-size:18px">您还没有安装flash播放器,请点击<a target="_blank" href="http://www.adobe.com/go/getflash">这里</a>安装</span> </div> </div> </div> </object> </div>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论