用于生成多色文本的 jQuery 插件，在悬停时会改变颜色 [英] jQuery plugin for generating multi coloured text which changes colour on hover

问题描述

我想为各种链接生成多色文本，从预先指定的颜色数组中为单个字母随机分配颜色，当将鼠标悬停在带有文本的 div 上时，颜色会发生变化.我在想一个jQuery 插件/脚本将是要走的路.

I would like to generate multicoloured text for various links, with a random assignment of colours to individual letters, from a pre-specified array of colours, which would change on hovering over the div with the text in. I am thinking a jQuery plugin/script would be the way to go.

我想知道是否存在这样的插件或近似值.

I am wondering if such a plugin, or a close approximation, exists.

谢谢，

尼克

推荐答案

好的，我用 jquery 举个例子.

Ok i whip up an example using jquery.

首先是你的文字

<p id="example">Multi color me</p>​

然后是javascript:

then the 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 示例

Heres the jsFiddle Example

注意:我没有做悬停，但我猜你可以从这里拿它:)

Note: i did not do the hover but I guessing you can take it from here :)

这篇关于用于生成多色文本的 jQuery 插件，在悬停时会改变颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！