jquery随机颜色悬停

Question

我使用jquery color生成一些随机的颜色。 Id像这些颜色在用户悬停在任何单选按钮标签上时显示。

继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。

=== UPDATE ===

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。

Answer 2

jQuery不支持彩色动画的主要问题。可以找到更多结果jQuery: animate text color for input field?

Answer 3

$('label').hover将为标签添加一个mouseover/mouseout事件。你无限的做到这一点，因为你一遍又一遍地调用频谱。 改为尝试此操作。

$('label').hover(function() { 
    (function anim() { 
     var hue = //hue stuff 
     $(this).animate({ 
      color: hue 
     }, 10000, function() { 
      anim(); 
     }); 
    })(); 
}, function() { 
    $(this).animate({ 
     color: //original color 
    }, 1000); 
});