Question

请教大神，CSS怎么实现鼠标移至一张图片时，图片变亮，其他图片变暗。或者是类似的效果？

我是新手小白，主要是用于店铺装修，我要的效果可以查看http://www.5icool.org/demo/2012/a00572/index2.html 还有就是据我所知，貌似JS代码淘宝不支持只能CSS。有人会么、、、、、我只剩10分了︶︿︶

Answer 1

你这种效果纯CSS是搞不出来的，我这有个类似的，你看看行不行

div{
    float: left;
    width: 180px;
    height: 180px;
    margin: 0 auto;
    background: url(Zombatar_1.jpg) center center no-repeat;
    z-index: 1;
}
a{
    filter: alpha(opacity=80);
    opacity: 0.8;
    width: 180px;
    height: 180px;
    display: block;
    background: #333;
    z-index: 100;
}
a:hover{
    filter: alpha(opacity=0);
    opacity: 0;
}

<div><a href="#"></a></div>
<div><a href="#"></a></div>
<div><a href="#"></a></div>

ie7，8，9测试通过，谷歌测试通过，其余的浏览器没测

追问

您能讲得详细点么？我复制黏贴代码不行、、、、、代码我完全看不懂，呵呵，求教了。

追答

。。。第一段是css代码，需要放到标签中

div{
float: left;
width: 180px;
height: 180px;
margin: 0auto;
background: url(Zombatar_1.jpg) centercenterno-repeat;
z-index: 1;
}
a{
filter: alpha(opacity=80);
opacity: 0.8;
width: 180px;
height: 180px;
display: block;
background: #333;
z-index: 100;
}
a:hover{
filter: alpha(opacity=0);
opacity: 0;
}

下面一段是html代码，放到标签中

Answer 2

css就行，很简单不复杂。以下：
img{opacity:0.8;}
img:hover{opacity:1;}
这样就能实现了。
其实就是设置图片的透明度就能实现啦~