右键单击锚点,不显示IE中的预期上下文菜单

时间:2013-03-05 09:13:02

标签: html css internet-explorer css3 web

我有以下HTML:

<a href="somewhere">
    <span class='mask'></span>
    <img src="my_image.jpg" />
</a>

和以下CSS:

a {
    display: block;
    position: relative;
}

a:hover .mask{
    background: rgba(255,255,255,0.1);
}

.mask {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

而且,在视觉上,它按预期工作。悬停时,<a>会在自身上显示半透明的掩码

然而,在除IE之外的每个浏览器中,当我右键单击<a>时,它按预期工作 - 我看到链接的上下文菜单。

但是在IE中,我看到了上下文菜单,好像我右键单击了页面中的任何其他静态项目。我正在寻找一种方法,使上下文菜单在IE中按预期工作。

干杯!

1 个答案:

答案 0 :(得分:0)

这在IE 9中适用于我 - 将z-index:-1添加到.mask。虽然z-index会影响你的掩蔽视觉效果。

.mask {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}

http://jsbin.com/osegib/1/edit#/osegib/2/edit