在jQuery中链接动画颜色变化？ [英] Link animated color changing in jQuery?

问题描述

我有一个名为#link的链接。

I've a link named #link.

悬停后会改变颜色，如下所示：

It changes color after hover, like this:

$("#link").hover(function(){
     $(this).css({color: '#fed900'});
});

所有我想做的是平滑，动画的颜色变化。

All I want to do is smooth, animated color change.

我知道我不得不把.css放在一个.animation中，但不知道如何。

I know I have to put .css in an .animation somehow, but can't figure it out how.

我认为这是正确的方式，但它根本不工作：

I think that's the right way, but it doens't work at all:

$("#link").hover(function(){
     $(this).animate( { css({color: '#fed900'}) }, "slow" );
});

我也试过这样：

$(this).animate({ .css({color: '#fed900'}), "slow" });   

但我仍然错了。任何援助之手？我知道我缺少一些很小的东西。

But I'm still wrong somehow. Any helping hand? I know I'm missing something really small.

推荐答案

调用 .animate（） 如下所示：

The call to .animate() looks like this:

$("#link").hover(function(){
  $(this).animate({ color: '#fed900'}, "slow");
}, function() {
  $(this).animate({ color: '#000000'}, "slow"); //original color
});

你可以试试这里。但请注意，您需要包含颜色插件或 jQuery UI ，因为jQuery核心不支持颜色动画。

You can give it a try here. But keep in mind that you need to include either the color plugin or jQuery UI, since jQuery core doesn't support color animations.

这篇关于在jQuery中链接动画颜色变化？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！