IE:只有一部分锚可以点击

时间:2009-07-02 17:30:48

标签: html css internet-explorer

我想要一个具有特定高度和宽度的锚。

上面没有文字,因为它意味着要放在页面的某个区域前面。

以下是代码:

<a href="/" style="width:370px;height:80px;display:block;position:absolute;"></a>

除了IE6和IE7之外,它的工作正常。如果我添加边框,我可以看到锚具有正确的尺寸,但如果我尝试点击它,只有顶部可点击

我不知道为什么会这样做。我尝试添加一个onclick,即使有警报,同样的事情,单击锚的底部是不可能的。

这真的很奇怪,以前这发生过吗?一切都会有所帮助。

5 个答案:

答案 0 :(得分:18)

处理这个问题的另一种方法是一个小的“黑客/解决方法”,当块元素得到背景颜色时,一切都很好,就像你所描述的那样。利用这样的东西:

a {
  ..
  background-color: white;
  opacity: 0;
  filter: alpha(opacity=0);
  ..
}

答案 1 :(得分:15)

在IE的早期版本中,无法在块级元素本身上注册onclick事件。相反,IE将onclick应用于块内的文本或内联元素。

我发现将transparent image放在与完整锚点大小相同的锚点内会注册onclick。

<a href="/" style="width:370px;height:80px;display:block;position:absolute;">
    <img src="Transparent.gif" style="width: 370px; height: 80px"/>
</a>

答案 2 :(得分:2)

由于此链接是绝对定位的,因此我觉得有另一个块部分重叠,因此将其中的一半隐藏在点击事件中。

答案 3 :(得分:2)

放置在锚背景中的任何图像,然后定位在视线之外将解决IE6和IE7的问题。您不需要像建议的那样拥有锚的完整大小的图像。

这意味着您可以使用页面上已加载的精灵或其他图像来保存对服务器的另一个调用。

<a style="position:absolute; z-index:2; background:url(/images/your-sprite.gif) -9999px no-repeat;" href="#">Your anchor</a>

答案 4 :(得分:0)

可能是这是另一个div / span / etc的z-index问题。