1

我有一个带有 z-index:1-100（用 javascript 更改）和 position:absolute 的 div。在里面我有一个带有 z-index:101 和 position:absolute 的 href。

所有 webbbrowsers 都将其呈现为带有 101 的那个显示在顶部（正确），但在 7-8-9 中它没有......为什么会这样？真的可以在这里使用一些帮助！

代码：

     <div id="bannerad">
     <a target="_blank" style="position:absolute;z-index:101;width:680px;height:120px;" class="mcdFade" href="http://www.mcdonalds.se"></a>
     <div id="fadea" style="position:absolute;visibility:hidden;"><img src="Images/Ads/McDHstad/1.jpg" width="800" height="120" alt="Fade"/></div>
     <div id="fadeb" style="position:absolute;visibility:hidden;"><img src="Images/Ads/McDHstad/2.jpg" width="800" height="120" alt="Fade"/></div>
     <div id="fadec" style="position:absolute;visibility:hidden;"><img src="Images/Ads/McDHstad/3.jpg" width="800" height="120" alt="Fade"/></div>   
     </div>

编辑

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

由视觉工作室生成

编辑 2 添加了 jsfiddle http://jsfiddle.net/Pesmd/18/但不能让它工作，你只能看到轻微的图像，但它在我的浏览器中工作

编辑 3 这似乎是 IE 中的一个主要问题，我尝试了我找到的解决方案，但没有结果。这里有没有可以帮助我解决这个问题的？

据我所知，当您有一个父级的位置不是默认设置时，z-index 属性会重置，但我仍然无法让它工作。

4

2 回答 2

0

将锚设置为 display:block 看看是否有效。然后在测试时在元素上添加一个 3px 大的绿色边框，以便您可以更好地看到它。

于 2011-09-07T22:13:26.073 回答
0

为什么不把你的链接包裹在 div 周围呢？

<div id="bannerad"> 
    <a target="_blank" style="position:absolute;z-index:101;width:680px;height:120px;" class="mcdFade" href="http://www.mcdonalds.se">
        <div id="fadea" style="position:absolute;visibility:hidden;"><img src="Images/Ads/McDHstad/1.jpg" width="800" height="120" alt="Fade"/></div>
        <div id="fadeb" style="position:absolute;visibility:hidden;"><img src="Images/Ads/McDHstad/2.jpg" width="800" height="120" alt="Fade"/></div>
        <div id="fadec" style="position:absolute;visibility:hidden;"><img src="Images/Ads/McDHstad/3.jpg" width="800" height="120" alt="Fade"/></div>
    </a>
</div>

编辑：我看了你的小提琴并使它起作用。这是一个与您想要的不同的设计，但它很简单并且可以完成工作而不必担心 z-index：http: //jsfiddle.net/kCsvG/3/

于 2011-09-07T22:27:18.957 回答