CSS 有关层的两个便签 ²

2008-06-02 14:40:24

两个都是不大不小的问题，在这里记录一下。

Flash 的遮盖问题

Flash 在默认没有相应参数的情况下，会遮盖 HTML 层并不受 CSS 的 z-index 属性控制。在这里有个简单的方法，就是在 object 中加入

<param value="transparent" name="wmode" />

即可。如果使用了 embed ，务必将此属性也加入

wmode="transparent"

这样，就不会遮盖绝对定位的层了。不过此时 object 还是不受 CSS 的 z-index 控制，寻求解决方案中。

参考链接，这里 还有 这里。

Explorer 6 下的 select 遮盖问题

这是个老的问题了，但是如果不小心的话还是出出现。问题是在 Explorer 6 下，某个绝对定位的层无法遮住 select 控件，而解决的办法就是使用 iframe 将其遮住，代码如下：

<!--[if lte IE 6.5]>
<div style="position:absolute;z-index:-1; top: 0; left: 0;">
    <iframe 
       style="filter:alpha(opacity=0); width:210px; height: 110px;">
    </iframe>
</div>
<![endif]-->

因为这仅仅是 Explorer 6 的问题，所以使用了条件注释，避免其他浏览器加入无谓的结构。

期间和 小马 讨论过是否将其写成脚本，回答是“基于效果、或者 BugFix 类的问题，出于效率的考虑，尽量不要使用脚本”。我同意他的观点，比如上述的代码对于其他非 Explorer 浏览器而言，仅仅是注释而已。

进一步的改进，可以使用脚本判断时候否是 Explorer 6 ，并动态加入 iframe 。排除效率的问题，这样操作更通用些。

相关的参考资料：这里、这里 还有 这里。

最后，上述两个问题的 DEMO 页面在这里。

--EOF--

顺便提下，Yupoo 支持 Flash 图像输出了，正好在这里用上。不过，我更喜欢直接用原图，这样更通用些。