如何更改单击文本链接时的悬停不透明度效果？

Question

如何取消绑定文本链接点击时的悬停不透明效果？

例如，

a.test {
    text-decoration:none;
}

a.test:hover {
    text-decoration:none;
    opacity:0.6 !important;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; 
    filter:alpha(opacity=60) !important; 
}

<a href="#" class="test">Click Me</a>

$(".test").click(function(){
   $(this).unbind('mouseenter mouseleave');
   return false;
})

我不希望单击时出现不透明悬停效果。

这是链接。

编辑：

我更喜欢没有黑客类的解决方案。是否可以？

Answer 1

这是一个解决方案，添加一个类，用于使用 css 重置不透明度。

a.test:hover {
    opacity:0.6 !important;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    filter:alpha(opacity=60) !important;
}

a.test.clicked:hover {
    opacity:1 !important;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter:alpha(opacity=100) !important;
}


<a href="" class="test">Click Me</a>


$(".test").click(function(){
   return false;
});

$(".test").mousedown(function(){
   $(this).addClass('clicked');
});

$(".test").mouseup(function(){
   $(this).removeClass('clicked');
});

Answer 2

如果您无法修改创建 :hover 状态的 CSS，请使用样式。

$('.test').css({'opacity':'1.0 !important','-ms-filter':'',filter:'none !important'});

内联样式应该比 CSS 样式具有更高的优先级。