jquery随机颜色悬停

Question

我正在使用jquery color生成一些随机颜色。我希望当用户将鼠标悬停在任何单选按钮标签上时显示这些颜色。

按照 this site 上的示例进行操作，我想我可以尝试一下:

spectrum();

function spectrum(){

var hue = ('lots of stuff here that generates random hue -- code on example webpage')

$('label').hover(function() {
   $(this).animate( { color: hue }, 10000) });

spectrum(); 

}

我的悬停选择器不起作用，所有内容都保持默认颜色。我显然以某种方式搞砸了，但我没有足够的经验来理解出了什么问题。有什么建议吗？

Answer 1

试试这个:

$(document).ready(function() {
    $('label').hover(function() {
        var hue = 'rgb('
            + (Math.floor(Math.random() * 256)) + ','
            + (Math.floor(Math.random() * 256)) + ','
            + (Math.floor(Math.random() * 256)) + ')';
       $(this).stop().animate( { color: hue }, 500);
    },function() {
       $(this).stop().animate( { color: '#000' }, 500);
    });
});

另请参阅我的jsfiddle .

===更新===

function startAnimation(o) {
    var hue = 'rgb('
        + (Math.floor(Math.random() * 256)) + ','
        + (Math.floor(Math.random() * 256)) + ','
        + (Math.floor(Math.random() * 256)) + ')';
    $(o.currentTarget).animate( { color: hue }, 500, function() {
        startAnimation(o);
    });
}

$(document).ready(function() {
    $('label').hover(
        startAnimation,
        function() {
            $(this).stop().animate( { color: '#000' }, 500);
        }
    );
});

查看我的更新jsfiddle .