JS实现颜色的10进制转化成rgba格式的方法
更新时间：2017年09月04日 11:44:16 作者：蓝精灵依米
这篇文章主要介绍了JS实现颜色的10进制转化成rgba格式的方法,涉及javascript针对颜色数值转换的相关运算操作技巧,需要的朋友可以参考下
本文实例讲述了JS实现颜色的10进制转化成rgba格式的方法。分享给大家供大家参考，具体如下：
当我们在已知一个整数如（0~256x256x256x256 之间的颜色值），想获得关于它的3原色加一个透明度时，即alpha, red, green, blue，可采用如下方法：
方法一：
function getColor(number) {
let color = number;
const blue = parseInt(color % 0x100, 10);
color = color >>> 8;
const green = parseInt(color % 0x100, 10);
color = color >>> 8;
const red = parseInt(color % 0x100, 10);
const alpha = (parseInt(color >>> 8, 10) / 0xFF).toFixed(1);
return `rgba(${red}, ${green}, ${blue}, ${alpha})`;
}
方法二：
function getColor(number) {
const alpha = number >> 24 & 0xff;
const red = number >> 16 & 0xff;
const green = number >> 8 & 0xff;
const blue = number & 0xff;
return `rgba(${red}, ${green}, ${blue}, ${alpha})`;
}
PS：这里再为大家推荐几款本站的相关在线工具：
在线RGB、HEX颜色代码生成器：
http://tools.jb51.net/color/rgb_color_generator
RGB颜色查询对照表_颜色代码表_颜色的英文名称大全：
http://tools.jb51.net/color/jPicker
在线网页调色板工具：
http://tools.jb51.net/color/color_picker
在线颜色选择器工具/RGB颜色查询对照表：
http://tools.jb51.net/color/colorpicker
更多关于JavaScript相关内容可查看本站专题：《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。
相关文章
每天一对象,今天我们也来new一个。没有系统的学过JS，没有特别的写过一个比较出色的类库，没有运用过一个很强的类库，prototype.js在进行着，慢慢的前进相信不久的将来就可以应用prototype.js来开发自己的应用程序了。2011-01-01
这篇文章主要为大家详细介绍了js基础之事件捕获与冒泡原理，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-10-10
这篇文章主要介绍了JS vs TS二分法博弈对比分析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2024-01-01
类的出现最终使JavaScript非常容易使用继承法,JavaScript类比大多数人意识到的更强大,它是构建真正的mixins的良好基础，本文介绍JavaScript中的Mixin介绍的非常详细，需要的小伙伴可以参考阅读一下2023-04-04
javascript中函数的特殊性与普通，对待函数可以像对待普通变量一样2008-05-05
今天小编就为大家分享一篇layui 对弹窗 form表单赋值的实现方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
这篇文章主要为大家介绍了JS 加载性能Tree Shaking优化详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-11-11
这篇文章主要介绍了JavaScript回调函数callback用法解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-01-01
这篇文章主要为大家详细介绍了JS面向对象之单选框实现，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-01-01
这篇文章主要介绍了js如何设置缓存及获取设置的缓存,需要的朋友可以参考下2014-05-05
最新评论