Flash中的IFRAME，在Safari上，打破位置：固定元素 [英] Flash inside an IFRAME, on Safari, breaks position:fixed elements
问题描述
更新了这个更新，因为我发现它不一定是嵌套的IFRAME，而只是在IFRAMEd文档中存在Flash，会破坏位置：fixed（也在IFRAME中）。
Updated this as I found it is not necessarily nested IFRAMEs, but merely the presence of Flash within the IFRAMEd document that will break position:fixed (also within the IFRAME).
这是不真实的。在Safari（Mac）上：
This is unreal. On Safari (Mac):
- Flash
- 模式窗口，Fancybox等）
- ...将打破该IFRAME中的任何position：fixed元素。
这是一个完美的例子： http://jsfiddle.net/6GP2A/请注意，我们有：
Here's a perfect example: http://jsfiddle.net/6GP2A/ Note that we have:
- 包含Flash的IFRAME（YouTube视频）。
- 在另一个IFRAME文档中（jsfiddle IFRAME的结果）
请注意，视频本身是IFRAMEd的事实是红色鲱鱼。如果Flash只是一个OBJECT标签，则会遇到同一问题。
Please note that the fact that the video is itself IFRAMEd is a red herring. If the Flash were merely an OBJECT tag sans IFRAME you would run into the same issue.
如果您在Chrome中打开这个标签，它会正常工作。
If you open this in Chrome, it will work as expected. The grey "hello I am fixed" DIV (which is postion:fixed) will stay fixed to the bottom.
在Safari中，灰色的DIV将会在您滚动时滑动
In Safari, the grey DIV will slide as you scroll the page.
Arrrrgh！任何建议？无数的搜索没有结果。谢谢！
Arrrrgh! Any advice? Countless searches have been fruitless. Thank you!
推荐答案
我遇到了同样的问题，但我们不能拒绝框架。
所以我调查这个问题，我发现一些解决方案（我猜）：
I encountered the same problem, but we cannot refuse to frames. So I investigate this problem and I found some solution (I guess):
当有一个div嵌套flash在必要的框架和风格div withposition：relative; z-index：-1;
When there is a div with nested flash in necessary frame and the style of the div with "position: relative; z-index: -1;" then elements with "position: fixed" in the frame looks fine.
例如
<html>
<head>
<style>
.menu {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 40px;
}
.footer {
width: 100%;
height: 40px;
position: fixed;
bottom: 0;
left: 0;
}
</style>
</head>
<body>
<frameset rows="20,*">
<frame>...</frame>
<frame>
<div class="menu">Header</div>
<!-- Some content here -->
<object width="440px" height="220px">
<param value="opaque" name="wmode">
<param value="http://youdomain.com/you_flash.swf" name="movie">
<embed width="440px" height="220px" type="application/x-shockwave-flash" src="http://youdomain.com/you_flash.swf">
</object>
<!-- Some content here -->
<div style="position: relative; z-index:-1;">
<object width="10px" height="10px">
<param value="opaque" name="wmode">
<param value="http://youdomain.com/fake_flash.swf" name="movie">
<embed width="10px" height="10px" type="application/x-shockwave-flash" src="http://youdomain.com/fake_flash.swf">
</object>
</div>
<div class="menu">Footer</div>
</frame>
</frameset>
</body>
</html>
一个带闪光的div就足够了。
One div with a flash is enough. All the other may be as is.
一句话 - 你不能在这个div中点击flash。我写了一个脚本，将动态添加与空Flash的div到Mac上的Safari。
One remark - you wouldn't be able to click on the flash in this div. I wrote a script which will dynamically add the div with empty flash to Safari on Mac.
希望这是有帮助的。
愿军队与你在一起。
这篇关于Flash中的IFRAME，在Safari上，打破位置：固定元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
