Bre*_*ett 2 css flash z-index internet-explorer-7
我花了好几个小时现在阅读IE7的问题,将Flash内容呈现在其他元素之上,特别是导航菜单(例如,这通常是下拉菜单和Flash广告横幅的问题).我已经尝试了一些建议的解决方案,但迄今为止没有一个对我有效.我将尽力解释这些情况,并对此事提出任何建议表示感谢!
更新
根据Mercator的要求,我提供了一个大型代码示例,以协助您提供任何建议.考虑下面的HTML:
<body>
<div id="page-wrap">
<div id="content-wrap">
<div id="main">
<h1>Page Title</h1>
<p>Paragraph text before video.</p>
<div class="video-container">
<script type="text/javascript">
AC_FL_RunContent('id','player','name','player','width','480','height','294','src','player','allowscriptaccess','always','allowfullscreen','true','flashvars','file=mp4/VIDEO_FILE.mp4','movie','player' ); //end AC code
</script>
<noscript>
<object id="player" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" name="player" width="480" height="294">
<param name="wmode" value="transparent" />
<param name="movie" value="player.swf" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="flashvars" value="file=mp4/VIDEO_FILE.mp4" />
<embed
wmode="transparent"
type="application/x-shockwave-flash"
id="player2"
name="player2"
src="player.swf"
width="480"
height="294"
allowscriptaccess="always"
allowfullscreen="true"
flashvars="file=mp4/VIDEO_FILE.mp4"
></embed>
</object>
</noscript>
</div>
<p>Paragraph after video.</p>
</div><!-- end main -->
<div id="subContent">
<p>Sub-content.</p>
</div><!-- end subContent -->
<div id="content-clear"></div>
</div><!-- end content-wrap -->
</div><!-- end page-wrap -->
<div id="footpanel">
<ul id="mainpanel">
<li id="panel-link"><a href="#"><span class="icon"></span>Panel Link</a>
<div class="subpanel">
<h3><span> – </span>Panel Link</h3>
<ul>
<li><p>Revealed content</p></li>
</ul>
</div>
</li>
</ul>
</div> <!-- END footpanel -->
</body>
Run Code Online (Sandbox Code Playgroud)
以下是适用于上述div的非表示性CSS选择器:
body { /*no positioning styles applied */ }
#page-wrap { width: 100%; }
#content-wrap { width: 960px; margin 0 auto; }
#main { float: left; width: 573px; }
.video-container { position: relative; width: 480px; z-index: 1; }
#sub { float: left; width: 347px; }
#content-clear { clear: both; }
#foot-panel { position: fixed; width: 94%; bottom: 0; left: 0; z-index: 3000; }
ul#main-panel { float: left; }
Run Code Online (Sandbox Code Playgroud)
footpanel使用jQuery驱动的弹出菜单,如果它提供任何进一步的上下文.这些菜单的300索引中的z索引显示在footpanel上方.
有问题的Flash是JW播放器播放flash视频或mp4.目前,object和embed标签位于容器div内.
我对以前的解决方案的理解是,param更改和容器div上的定位/ z-index变化的组合应该已经解决了这个问题.唉,事实并非如此.玩家位于脚踏板的顶部.
其他可能有用或可能没有用的信息是该页面是XHTML 1.0 Transitional,而Dreamweaver在HTML代码中报告1个错误:<embed>不在XHTML 1.0规范中.这一事实并不妨碍在任何测试的浏览器中查看视频,并且页面仍然可以在FF中正确显示.
提前致谢!
小智 5
我知道我在这里玩这个游戏已经很晚了,但是我想我会把你的嵌入标签中的wmode ="transparent"放在那里帮助解决这个问题,因为它会以某种方式迫使Flash服从z-index(我再次使用这个词) "某种程度上",因为有关于为什么会这样的稀疏文档 - 至少根据我的经验,文档很少.
所以无论如何,将wmode ="transparent"置于嵌入内部,然后从包含视频的实际div中删除z-index和定位.
那应该是有效的.如果没有,那么它可能是一个不同的问题,因为我刚才有完全相同的问题并且做了这两件事就为我修好了.
我希望有所帮助.
哦,你可能会考虑检查一下(这对我帮助很大):http://manisheriar.com/blog/flash_objects_and_z_index
凯西J.伯克