Question

我想为所有链接的颜色变化添加动画。我的意思是，没有任何Javascript，当链接悬停时，它的颜色会立即改变。我想要做的是，当你悬停链接时，它的颜色应该使用jQuery的 $ .animate 函数逐步改变。

直到这里很容易做到。但问题是，我不想为每种链接类型编写RGB代码。我想让jQuery知道链接在盘旋时的颜色。

如果你在此之前不理解我，请让我用一个例子解释一下：

$('a').hover(function () {
    $(this).animate( { 'color', $(this + ':hover').css('color') }, { duration: 250 });
}, function () {
    $(this).animate( { 'color', $(this).css('color') }, { duration: 250 });
});

我知道这段代码不起作用，但我认为它解释了我需要清楚的内容。

Answer 1

我会使用CSS3过渡： http://jsfiddle.net/wsZKQ/1/

a{
    -moz-transition:all 0.25s;
    -webkit-transition:all 0.25s;
    transition:all 0.25s;
    color:black;
}
a:hover{
    color:red;
}

如果你想用jQuery做，你需要一个插件来访问:hover - 样式： http://archive.plugins.jquery.com/project/moreSelectors

我认为没有插件可以访问:hover样式。

Answer 2

var color = $('element').css('color');

如果您通过RGB设置，例如rgb（红色，绿色，蓝色）样式，则不必进行十六进制变换。你可以轻松地改变0-255的颜色。

我用RGB完成了类似的事情，看看http://www.homeschoolsnowboarding.com是否耐心，看着背景慢慢改变颜色。

如何使用jQuery从CSS获取颜色属性？

2 个答案: