我正在使用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();
}
我的悬停选择器不起作用,所有内容都保持默认颜色。我显然以某种方式搞砸了,但我没有足够的经验来理解出了什么问题。有什么建议吗?
最佳答案
试试这个:
$(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 .
关于jquery随机颜色悬停,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7379353/