我想为各种链接生成多色文本,从预先指定的颜色数组中随机分配颜色到单个字母,当将鼠标悬停在带有文本的 div 上时会发生变化。我在想一个 jQuery 插件/脚本将是要走的路。
我想知道是否存在这样的插件或近似值。
谢谢,
缺口
好的,我使用 jquery 编写了一个示例。
首先你的文字
<p id="example">Multi color me</p>
然后是javascript:
$(document).ready(function() {
var test = $("#example").text().split('');
var result = "";
var i = 0;
for(i=0; i < test.length; i++) {
result += "<span style='color:"+getColor()+"'>"+test[i]+"</span>";
}
$("#example").html(result);
});
function getColor() {
var colList = ['#00FF00', '#FF0000','#0000FF'];
var i = Math.floor((Math.random()*colList.length));
return colList[i];
}
这是 jsFiddle示例
注意:我没有做悬停,但我猜你可以从这里拿它:)
你可以试试这个:
$('a').on('hover', function( {
$(this).css('color', getRandomColor());
})
);
function getRandomColor() {
var myAwesomeColorList['#ccc', '#fff'];
return myAwesomeColorList[Math.floor((Math.random()*myAwesomeColorList.length))]
}