javascript计算渐变颜色的实例
2017-09-22 09:35
676 查看
javascript计算渐变颜色的实例
有时候,一个表格或者一片区域内,需要若干同色系从浅到深的颜色,如图所示:
如果需要的颜色少,则颜色的差异较大,需要的颜色多,则颜色差异小,如下图:
这时,就用到了同色系渐变颜色的计算,算法如下:
function getItemColors (colorLevel) { var colors= []; //默认的最深颜色 var red = 134,green = 108, blue = 184; //最浅颜色是239,239,239 比如:最浅颜色的red是 239 则差值为239-134=105 var maxRed = 105,maxGreen = 131,maxBlue = 55; var level = colorLevel; while(level--) { colors.push( 'rgb('+red +','+green+','+blue+')'); red += parseInt(maxRed/colorLevel); green += parseInt(maxGreen/colorLevel); blue += parseInt(maxBlue/colorLevel); } return colors; }
如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
您可能感兴趣的文章:
相关文章推荐
- JavaScript实现的鼠标响应颜色渐变效果完整实例
- Javascript 颜色渐变效果的实现代码
- JavaScript采用递归算法计算阶乘实例
- php使用GD实现颜色渐变实例
- JavaScript lastIndexOf方法入门实例(计算指定字符在字符串中最后一次出现的位置)
- jQuery实现的文字hover颜色渐变效果实例
- JavaScript颜色渐变效果(转载)
- JavaScript indexOf方法入门实例(计算指定字符在字符串中首次出现的位置)
- 每天一个JavaScript实例-使用缓存计算(memoization)来提高应用程序性能
- javascript实现颜色渐变的方法
- JavaScript淡入淡出渐变简单实例
- 中文前端UI框架Kit(五)支持Css全属性/Css Hack/Css3属性/颜色渐变的Javascript动画,相比JQuery和Mooltools,功能更为强大,这不是标题党!
- JavaScript 颜色梯度和渐变效果
- php使用GD实现颜色渐变实例
- JavaScript lastIndexOf方法入门实例(计算指定字符在字符串中最后一次出现的位置)
- JavaScript 计算笛卡尔积实例详解
- JavaScript 颜色梯度和渐变效果更新
- JavaScript 颜色梯度和渐变效果第1/3页
- Javascript 颜色渐变效果的实现代码