使用jQuery fadeIn Effect Plugin：悬停链接

Question

我正在创建链接，在鼠标悬停时它们的背景变化很容易用CSS制作它但是我想要原始背景的淡出效果，显示悬浮的一个慢慢地。我想使用jQuery插件使这种淡入淡出（in / out）效果适用于具有某些类的链接。

我想要的只是让.CLASS:hover在悬停时淡出或.CLASS淡出淡出.CLASS:hover ...而不会更改为原来的一个类别背景和另一个为悬停的。

Answer 1

您可以使用 CSS3-Transitions 执行此操作。支持很棒（所有现代浏览器，甚至是IE）

#foo {background:red; @include transition(background 1s)}
#foo:hover {background:yellow}

纯CSS：

#foo {
background:red;
-webkit-transition:background 1s;
-moz-transition:background 1s;
-o-transition:background 1s;
transition:background 1s
}

#foo:hover {background:yellow}

Answer 2

您可以使用css3

执行此操作

.CLASS{
    background: <put the color here>;
    transition: background 0.5 ease;
}
.CLASS:hover{
    background: <put the other color here>;
}