背景中的 Flash 电影和 Chrome 中固定的位置 => 不良行为答案

【问题标题】：Flash movie in background and position fixed in Chrome => bad behaviour背景中的 Flash 电影和 Chrome 中固定的位置 => 不良行为
【发布时间】：2012-07-01 00:43:38
【问题描述】：

如果在后台播放 Flash 电影，Google Chrome 会破坏某些 div 元素的固定位置。

示例：我的页眉和页脚定位为固定（顶部、底部）。当我滚动窗口时，它们在 Firefox、Safari (5.1.7) 等中保持在顶部和底部，但随着 Chrome 中的内容一起移动。

我使用 SWFObject 2.2 来放置 Flash 影片。我已经尝试了所有的 wmode（透明、不透明、窗口）

HTML 代码：

<script type="text/javascript">
  var fv = {};
  swfobject.embedSWF('background.swf', 'back-flash', '100%', '100%', '10.0.0', 
  'expressinstall.swf', fv, {bgcolor: '#222222', menu: 'false', wmode: 'opaque'}, 
  {id: 'back-flash'});
</script>

包含 Flash 电影的 div 的 z-index 设置为 -99 并且上述元素的z-index设置为99

CSS 代码：

#back-flash-holder{
 top: 0;
 left: 0;
 z-index: -99;
 width: 100%;
 height: 100%;
}
#header{
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 80px;
 background-color: #ddd;
 z-index: 99;
}

Mac OSX，Chrome 版本：19.0.1084.56，Flash Player 版本：11.3.300.257

示例：jsfiddle.net/WE8wv

知道为什么它不能在 Chrome 中运行，而在 Safari 中运行吗？

【问题讨论】：

注意：在 Windows 上一切正常。

标签： css flash google-chrome z-index swfobject

【解决方案1】：

尝试将您的顶部和左侧值设置为包括 px。我遇到了 Chrome 对我的语法过于挑剔的问题。

【讨论】：

感谢@Brian，但包括 px 没有区别。