不过标签云字体默认情况尺寸不同,但色彩一致,看起来相当杂乱,不美观,虽然有 Simple Tags 等插件可以为标签上色,但是直接修改来实现会更好。毛主席教导我们,自动手丰衣足食,发扬光荣革命传统自己动手。
1.首先打开你的wordpress主题的footer.php文件
插入如下代码
首先引用新浪的jquery类库
<script type=”text/javascript” src=”http://lib.sinaapp.com/js/jquery/1.7/jquery.min.js“></script>
2.在引用的jquery类库后边插入我们的关键代码!
<script type=”text/javascript”>
<!–
//标签云自动彩色欢迎访问我的bloghttp://www.onbno.com
var config = {//定义颜色数组
‘selector’: ‘*’,
‘color’: [‘LightPink’, ‘orange’, ‘Crimson’, ‘PaleVioletRed’, ‘red’,’blue’,’SlateBlue’, ‘SkyBlue’, ‘PaleGreen’, ‘GreenYellow’, ‘OliveDrab’, ‘DarkKhaki’, ‘SaddleBrown’, ‘Olive’],
‘shuffle’: 1,
‘singcolor’: 0
};
for (i = 0, j = 1; j < config.color.length; i++, j++) {
rand = j + parseInt(Math.random() * (config.color.length – j));
temp = config.color[rand];
config.color[rand] = config.color[i];
config.color[i] = temp;
}
$(“#tag_cloud-2 a”).each(function(i) {//tag_cloud-2是标签云的id
$(this).css(‘color’, config.color[i % config.color.length]); //超出颜色数组长度自动归0
$(this).css(‘border-bottom’, ‘1px solid ‘);//设置边框
$(this).css(‘border-color’, config.color[i % config.color.i]);//设置边框颜色
});
//标签云自动彩色
–>
</script>
具体效果请看本站的彩色标签云
» 转载请注明来源:网络蛀虫小窝 » 《纯jquery代码实现标彩色签云(原创)》» 本站地址:http://www.gomoth.com
- 您可能感兴趣的相关文章
- * 用jquery与CSS制作导航Menu
- * JQUERY获取当前页面的URL信息
- * 浮动导航jquery代码
- * jquery修改css属性
- * 国内的公共js资源库
- * jquery调试ajax的帮助信息debug