css 实现鼠标悬浮透明度变化

.post-nav {
opacity: 0.2;
-moz-opacity: 0.2;
filter: alpha(opacity=20);
}
.post-nav:hover {
opacity: 1;
-moz-opacity: 1;
filter: alpha(opacity=100);
}

比较简单,利用伪类 hover 实现的,效果见我上面的 post 导航。

Tags:

This entry was posted on Friday, November 7th, 2008 at 2:09 pm and is filed under general stuff. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

Posts you may enjoy

2 Responses to “css 实现鼠标悬浮透明度变化”

gravatar image

Shawn November 10th, 2008 at 12:54 am | reply

opacity filter 在 IE 上的效果不好,容易出现漆黑一片的情况。
firefox3 直接支持 opacity:0.2,可以不用 -moz-opacity 了。

gravatar image

Centeur November 10th, 2008 at 3:26 pm | reply

@Shawn:很高兴你能分享你的经验,谢谢。

Leave a Reply

Please copy the string o5VpeU to the field below: