/**
* 颜色渐变
* num:颜色个数
*/
function fColorGradualChange(startColor, endColor, num) {
var rgb = /^rgb|RGB\((([0-9]|[1-9]\d|1\d\d|2([0-4]\d|5[0-5])),){2}([0-9]|[1-9]\d|1\d\d|2([0-4]\d|5[0-5]))\)$/; //rgb
var hex = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i; //16进制
//颜色预处理
var startRGB, endRGB;
if (hex.test(startColor)) {
startRGB = fAnalysisRGB(startColor);
} else if (rgb.test(startColor)) {
startRGB = startColor.substring(3, 15).split(',');
}
if (hex.test(endColor)) {
endRGB = fAnalysisRGB(endColor);
} else if (rgb.test(startColor)) {
endRGB = endColor.substring(3, 15).split(',');
}
var startR = startRGB[0], startG = startRGB[1], startB = startRGB[2];
var endR = endRGB[0], endG = endRGB[1], endB = endRGB[2];
var sR = (endR - startR) / num;
var sG = (endG - startG) / num;
var sB = (endB - startB) / num;
var colors = [];
for (var i = 0; i < num; i++) {
colors .push(fColorToHex(parseInt((sR * i + startR)), parseInt((sG * i + startG)), parseInt((sB * i + startB))));
}
return colors ;
}
/**
* 解析rgb格式
*/
function fAnalysisRGB(color) {
var color = color.toLowerCase().substring(1, color.length);
var colors= [];
colors.push(parseInt(color.substring(0, 2), 16))
colors.push(parseInt(color.substring(2, 4), 16))
colors.push(parseInt(color.substring(4, 6), 16))
return colors;
}
/**
* rgb转hex
*/
function fColorToHex(r, g, b) {
var hex = "#" + fAddZero(r.toString(16)) + fAddZero(g.toString(16)) + fAddZero(b.toString(16));
return hex;
}
/**
* 加0补位
*/
function fAddZero(v) {
var newv = "00" + v;
return newv.substring(newv.length - 2, newv.length);
}
js颜色渐变实现
猜你喜欢
转载自blog.csdn.net/ai520587/article/details/83659071
今日推荐
周排行