当前位置: 动力学知识库 > 问答 > 编程问答 >

How to get color property from CSS with jQuery?

问题描述:

I want to add an animation to all links' color change. I mean, without any Javascript, when a link is hovered, its color changes immediately. What I want to do is, when you hover a link, its color should change step by step with jQuery's $.animate function.

It's easy to do until here. But the thing is, I don't want to write the RGB code for each of the link types. I want jQuery to know what color a link has to be when it's hovered.

If you didn't understand me until here, let me explain it with an example:

$('a').hover(function () {

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

}, function () {

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

});

I know this code won't work, but I think it explains what I need clearly.

网友答案:

I would use CSS3 transitions: 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;
}

If you want to do it with jQuery, you need a plugin for accessing the :hover-styles: http://archive.plugins.jquery.com/project/moreSelectors

I don't think there is a way to access the :hover styles without a plugin.

网友答案:
var color = $('element').css('color');

If you set via RGB such as rgb(red,green,blue) style you don't have to do hex transforms. You could easily change colors from 0-255.

I've done similar things with RGB take a look at http://www.homeschoolsnowboarding.com be patient and watch the background slowly change colors.

分享给朋友:
您可能感兴趣的文章:
随机阅读: