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); 
});