哈弗样式不适用使用IE过滤器和元素不能被点击时

我想创建一个可点击的叠加页面的任意部分的位置上。 覆盖主要是半透明的,但有一个部分是完全不透明的,所以我不能简单地使用不透明属性。

我能够使它在所有浏览器IE除外7和第8(我不关心IE 6)。

我的解决办法只是要使用RGBA和悬停风格会改变这种风格半透明的背景。 当然,RGBA是不是在IE之前9可用,所以我用滤波器和-ms滤波器用梯度来达到同样的效果。

问题是,该元素似乎并没有收到任何悬停事件一旦应用了渐变滤镜,因为没有使用悬停风格,不叫JavaScript事件。

如何同时在IE中使用的梯度过滤器接收悬停事件的任何想法?

下面是被施加到覆盖元件的样式:

#foo { cursor: pointer; position: absolute; top: 0; left: 0; height: 400px; width: 400px; background-color: rgba(230, 250, 250, .25); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#40B0FAFA', endColorstr='#40B0FAFA')"; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#40B0FAFA', endColorstr='#40B0FAFA'); zoom: 1; } #foo:hover { background-color: rgba(230, 250, 250, 1); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFB0FAFA', endColorstr='#FFB0FAFA')"; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFB0FAFA', endColorstr='#FFB0FAFA'); }

下面是使用的jsfiddle问题的一个简单的例子。

--------------解决方案-------------

你可以创建围绕一个jQuery的工作。

$('#foo').hover(function() {
$(this).css('backgroundColor', 'rgba(230, 250, 250, 1)');
//...
});

分类:JavaScript的 时间:2015-03-15 人气:0
分享到:

相关文章

Copyright (C) 55228885.com, All Rights Reserved.

55228885 版权所有 京ICP备15002868号

processed in 0.882 (s). 10 q(s)