插件下载

压缩版本：jquery.rainbowlist.min.js

开发者版本： jquery.rainbowlist.js

使用方法

比如有这样一段HTML：

<ul class="rainbowList">
	<li><a href="javascript:">:after伪类清除浮动</a></li>
	<li><a href="javascript:">嵌入flash</a></li>
	<li><a href="javascript:">让ie6加载特殊的CSS</a></li>
	<li><a href="javascript:">WordPress中按时间输出文章</a></li>
	<li><a href="javascript:">:after伪类清除浮动</a></li>
	<li><a href="javascript:">嵌入flash</a></li>
	<li><a href="javascript:">让ie6加载特殊的CSS</a></li>
	<li><a href="javascript:">WordPress中按时间输出文章</a></li>
	<li><a href="javascript:">让ie6加载特殊的CSS</a></li>
	<li><a href="javascript:">WordPress中按时间输出文章</a></li>

</ul>

我们引入jQuery和RainBowList插件:

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="jquery.rainbowlist.min.js"></script>

最后我们可以这样使用插件：

$(".rainbowList li a").RainBowList();

API参数

参数 默认值 说明
span 10 颜色跨度值，类型为数字(正负皆可)
hoverState true 鼠标悬停效果(默认加边框和外发光,类型为boolean)
hoverClass null 鼠标悬停自定义class属性名,类型为string

所以我们可以这样调用：

$(".rainbowList li a").RainBowList({
	span : 20,
	hoverState : true,
	hoverClass : hover
});