WEB开发 十进制RGB颜色转化为标准代码或十六进制


今天做web交互的时候对服务器下发的rgb色百思不得其解,竟然是一串数字而且还有负数,后来观察了几列数据后发现其白色有可能为16777215或-1,那么意味着当数字小于0时会加上16777216,于是我百度了一下这个数字顿时茅塞顿开,原来是rgb所能表达的最大颜色(256 * 256 * 256),但是网页肯定必须使用rgb或者十六进制来表示,那么就写了个函数来转换一下:

// 转化为 255,255,255 这样的格式
function rgbFormat  (value) {
        var r = (value & 0xff0000) >> 16;
	var g = (value & 0x00ff00) >> 8;
	var b = (value & 0x0000ff);
	return r + ',' + g + ',' + b;
}
// 转换为十六进制 prefix增加前缀可以方便直接生成带#号的颜色
function rgbHex (value, prefix) {
	var code = parseInt(value);
	var prefix = prefix || '';
	if (code < 0) {
		code = (256 * 256 * 256) + code;
	}
	var hex = code.toString(16);
	return prefix + (Array(6).join(0) + hex).slice(-6);
}	var code = parseInt(value);
	var prefix = prefix || '';
	if (code < 0) {
		code = (256 * 256 * 256) + code;
	}
	var hex = code.toString(16);
	return prefix + (Array(6).join(0) + hex).slice(-6);
}

转换为16进制的时候关键要注意小于0时补成正数,以及十六进制不满6位不足自动补零(不然浏览器也识别不出来)

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值