饱和度较低的几种随机颜色，JavaScript算法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>colors</title><style type="text/css">.div {width:100px; height:100px; float:left;}</style></head> <body><div class="div"></div><div class="div"></div><div class="div"></div><div class="div"></div><div class="div"></div><div class="div"></div> <script type="text/javascript">window.onload=function(){ var obj=document.getElementsByClassName('div'); for(var i=0;i<obj.length;i++){ obj[i].style.backgroundColor=hsl2color([radomFuc(360), 100, 70]) }}function radomFuc($value) { //取随机数 return parseInt($value * Math.random());} function hsl2color(hsl) { //HSL颜色算法 if (hsl[0] > 360 || hsl[0] < 0 || hsl[1] > 100 || hsl[1] < 0 || hsl[2] > 100 || hsl[2] < 0) return "#000000"; var rgb = [0, 0, 0]; if (hsl[0] <= 60) { rgb[0] = 255; rgb[1] = Math.floor(255 / 60 * hsl[0]); } else if (hsl[0] <= 120) { rgb[0] = Math.floor(255 - (255 / 60) * (hsl[0] - 60)); rgb[1] = 255; } else if (hsl[0] <= 180) { rgb[1] = 255; rgb[2] = Math.floor((255 / 60) * (hsl[0] - 120)); } else if (hsl[0] <= 240) { rgb[1] = Math.floor(255 - (255 / 60) * (hsl[0] - 180)); rgb[2] = 255; } else if (hsl[0] <= 300) { rgb[0] = Math.floor((255 / 60) * (hsl[0] - 240)); rgb[2] = 255; } else if (hsl[0] <= 360) { rgb[0] = 255; rgb[2] = Math.floor(255 - (255 / 60) * (hsl[0] - 300)); } var sat = Math.abs((hsl[1] - 100) / 100); rgb[0] = Math.floor(rgb[0] - (rgb[0] - 128) * sat); rgb[1] = Math.floor(rgb[1] - (rgb[1] - 128) * sat); rgb[2] = Math.floor(rgb[2] - (rgb[2] - 128) * sat); var lum = (hsl[2] - 50) / 50; if (lum > 0) { rgb[0] = Math.floor(rgb[0] + (255 - rgb[0]) * lum); rgb[1] = Math.floor(rgb[1] + (255 - rgb[1]) * lum); rgb[2] = Math.floor(rgb[2] + (255 - rgb[2]) * lum); } else if (lum < 0) { rgb[0] = Math.floor(rgb[0] + rgb[0] * lum); rgb[1] = Math.floor(rgb[1] + rgb[1] * lum); rgb[2] = Math.floor(rgb[2] + rgb[2] * lum); } return "#" + (0x1000000 + rgb[0] * 0x010000 + rgb[1] * 0x000100 + rgb[2]).toString(16).substring(1);}</script></body></html>
发表回复