0

我已经使用 960.gs 模拟了一个页面，该页面在 div 中固定了几个元素，页面的内容将在该 div 下流动。这个 div 的背景是 CSS 渐变，高度为 100%（如果渐变应用于页面的实际主体，它实际上并没有扩展页面的整个宽度）。当用户向上滚动时，内容将在不透明菜单后面可见。

http://resume.jamesfishwick.com/

布局在 FF 和 Chrome 中按我想要的方式工作，但页面内容在 IE7 中的固定上部区域滚动。

我知道正在创建一个新的堆叠上下文，但是我无法通过摆弄相关元素或其父元素的 z-index 来解决这个问题。我知道我可以合并网格使用的一些额外 div，但我无法以保持渐变和透明度效果的方式这样做。

如何在 IE7 中实现这种外观？

4

2 回答 2

0

您需要为该滚动 div 提供一个小于主标题上的 z-index 的 z-index。要控制 msie 7 的透明度，只需将以下 css 代码添加到文档末尾的 </body> 标记之前。


/* ie6 hack */
* html .gradientLayer { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/path_to_images/mygradient.png', sizingMethod='scale')); }
/* ie7 hack */
*+ html .gradientLayer { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/path_to_images/mygradient.png', sizingMethod='scale')); }
于 2011-02-08T03:34:02.570 回答
0

在 IE7 中，元素被其定位的父元素捕获，无法逃脱。不能交织定位父节点的子节点，因为 ie7 和 6 错误地将 z-index 应用于定位元素，而它们应该应用 auto。

除了不定位我的情况不可能的父级之外，没有其他方法可以逃避这一点，因为我希望它修复。

所以我需要更改设计并将渐变应用到另一个元素而不是 100% 高固定元素。这将允许标题与内容分开，然后内容可以放在标题下。

于 2011-02-10T13:15:24.737 回答