Question

我在图像包装器中有一个图像和一个叠加层。将鼠标悬停在包装上会导致叠加层从透明度0变为0.8。它适用于所有浏览器，但IE。我相信我正在使用适当的IE滤镜来实现不透明度。请看一下代码：

HTML

<div class="img-wrap">
    <img class="profile" src="images/z.jpg">
    <a href="team-employee-z.html" class="img-overlay team"> </a>
</div>

CSS

.img-wrap {
    margin-right: 3px;
    float: left;
    height: 100%;
    overflow: hidden;
    position: relative;
    width: 250px;
}

.img-overlay {
    text-decoration: none;
    display: none;
    height: 100%;
    background-color: #000;
    color: #fff;
    opacity: 0;
    filter: alpha(opacity = 0);
    position: absolute;
    width: 100%;
    z-index: 100;
}

.img-overlay.team {
    top: 0;
}

.img-wrap:hover .img-overlay {
    display: block;
    opacity: 0.80;
    filter: alpha(opacity = 80);
    transition: opacity 0.25s;
    -moz-transition: opacity 0.25s;
    -webkit-transition: opacity 0.25s;
}

Answer 1

-MS-滤波器： “的progid：DXImageTransform.Microsoft.Alpha（不透明度= 50）”;

此过滤器应适用于7-8

IE悬停问题与图像叠加

1 个答案: