使用 jQuery fadeIn Effect 插件 on :悬停链接

Question

我正在创建链接，其中的背景在鼠标悬停时会发生变化，使用 CSS 很容易做到这一点，但我想要原始背景的淡出效果，显示悬停缓慢。我想使用jQuery插件使这种淡入（入/出）效果应用于具有某些类的链接。

我想要的只是让.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>;
}