2

我正在使用jQuery库，这是我的代码：

CSS：

.card{
    hight: 100px;
    width: 100px;
    background-color: black;
    opacity: 0.2;
}

HTML：

<div class="card"></div>

Javascript：

$(".card").hover(function () {
    alert($(this).css("opacity"))
});

opacity 选项适用于所有浏览器（该框具有透明度），但 Chrome、Firefox 和 Safari 向我显示了一个值为“0.20000002345”的弹出窗口。只有Internet Explorer 9 显示“1”。

4

2 回答 2

5

使用alpha filter可以解决问题 - 在 IE9 中不需要它...除非 IE9 在兼容模式下查看页面（因此就像旧版本的 IE）。

如果 OP 将页面作为本地 Intranet 区域站点查看，则兼容模式是 IE9 中的默认查看模式（与 Internet 区域相反），因此css opacity无法正常工作。

在 IE9 中，转到：页面 -> 兼容性视图设置 -> 取消选中“在兼容性视图中显示 Intranet 站点”以将其关闭。

混合安全区域和兼容模式可以解释为什么 OP 出现问题，以及为什么在公共互联网上查看上述链接测试页面的任何人都会正确看到它。

于 2012-10-30T19:04:26.157 回答
3

IE 中不透明度的 CSS（版本 <9）

filter:alpha(opacity=20);

jQuery 为它：

$(".card").hover(function () {
    alert($(this).css("opacity"));
    var filter = $(this).css('filter');
    if (filter) {
        filter = parseInt( filter.replace(')','').replace('alpha(opacity=','') ) / 100; }

        alert(filter);
});​

jsFiddle 上的示例

于 2012-09-11T00:28:54.160 回答