java如何获得相反的颜色_javascript – 如何根据当前颜色生成相反的颜色?

更新:

GitHub上的生产就绪代码.

我就是这样做的:

>将HEX转换为RGB

>反转R,G和B组件

>将每个组件转换回HEX

>用零和输出填充每个组件.

function invertColor(hex) {

if (hex.indexOf('#') === 0) {

hex = hex.slice(1);

}

// convert 3-digit hex to 6-digits.

if (hex.length === 3) {

hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];

}

if (hex.length !== 6) {

throw new Error('Invalid HEX color.');

}

// invert color components

var r = (255 - parseInt(hex.slice(0, 2), 16)).toString(16),

g = (255 - parseInt(hex.slice(2, 4), 16)).toString(16),

b = (255 - parseInt(hex.slice(4, 6), 16)).toString(16);

// pad each with zeros and return

return '#' + padZero(r) + padZero(g) + padZero(b);

}

function padZero(str, len) {

len = len || 2;

var zeros = new Array(len).join('0');

return (zeros + str).slice(-len);

}

示例输出:

f0070ae3ccbd40514029fa8307b1298c.png

高级版:

这有一个bw选项,决定是否反转为黑色或白色;所以你会得到更多的对比度,这对人眼来说通常更好.

function invertColor(hex, bw) {

if (hex.indexOf('#') === 0) {

hex = hex.slice(1);

}

// convert 3-digit hex to 6-digits.

if (hex.length === 3) {

hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];

}

if (hex.length !== 6) {

throw new Error('Invalid HEX color.');

}

var r = parseInt(hex.slice(0, 2), 16),

g = parseInt(hex.slice(2, 4), 16),

b = parseInt(hex.slice(4, 6), 16);

if (bw) {

// http://stackoverflow.com/a/3943023/112731

return (r * 0.299 + g * 0.587 + b * 0.114) > 186

? '#000000'

: '#FFFFFF';

}

// invert color components

r = (255 - r).toString(16);

g = (255 - g).toString(16);

b = (255 - b).toString(16);

// pad each with zeros and return

return "#" + padZero(r) + padZero(g) + padZero(b);

}

示例输出:

ca76b604df0d01cc6cc6d815b08be37e.png

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/443059.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

wamp php启动不成功,wamp的mysql 启动失败解决

wamp启动失败,查看原因是mysql 启动失败首先查看mysql的启动日志命令:mysqld --console知道error报错的地方:然后百度了此报错,解决方法在my.ini中添加innodb_force_recovery 1发现这个会影响insert需要设置为 innodb_force_reco…

php复选框样式,如何自定义checkbox样式?附代码

本篇文章给大家带来的内容是关于如何自定义checkbox样式?附代码,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。修改原生checkbox样式。效果原理1.利用CSS3属性 appearance。该属性(强制)更改(改变)默认(原生)样式…

JAVA用数据留给出师表排序,如果诸葛亮会编程,用Java写出师表...

继上一篇 "如果诸葛亮用C#写出师表..."后,站长想自己的第一语言是Java,虽然平时工作上用的不多,也用Java实现一遍吧,改改就是了,无非就是:C#的Console.WriteLine改为Java的System.out.println;C#…

linux下的安装命令行工具下载,linux系统程序安装(二)yum工具2-yum源及包下载

继续我们的yum工具应用之旅,yum工具之所以方便就是因为有方便的在线云库,实际工作中我们可能没办法链接互联网,或者我们想安装的程序原生源那么我们能不能用其他方式应用方便的yum源呢?一、使用光盘作为yum源1、将光盘挂载到/mnt目…

体积最小桌面linux,Tiny Core Linux - 体积最小的精简 Linux 操作系统发行版之一 (仅10多MB)...

Tiny Core Linux (TCL) 是一款极体积极小且高度可扩展的微型 Linux 发行版,它将一个 Linux 操作系统精简到仅有 10 多 MB 左右的大小,似乎小巧得有点让人叹为观止!要知道无论是常见的 Ubuntu、CentOS、Debian 的体积动辄就是几百MB甚至要上GB…

linux新建samba账户,ubuntu上创建账户和samba用户

系统环境:Linux ubuntu152 3.2.0-23-generic #36-Ubuntu SMP Tue Apr 10 20:39:51 UTC 2012 x86_64 x86_64x86_64 GNU/Linux系统用户登录创建linux账户:1. sudo adduser username --home /home/username执行该命令后需要两次输入账户密码,连续回车&…

在c语言中优先级最低的是6,C语言中 *,<<,= ,->哪个优先级最低

满意答案nishiwodezmx推荐于 2016.03.13采纳率:46% 等级:12已帮助:6812人最高的是->(指向运算符)再到*再到>>(右移运算符)再到(赋值运算符)c语言运算符号:1级优先级 左结合() 圆括号[] 下标运算符-> 指向结构体成员运算符. 结…

队列的顺序数组c语言代码,队列-队列的顺序表示和实现

队列-队列的顺序表示和实现和顺序栈相类似,在利用顺序分配存储结构实现队列时,除了用一维数组描述队列中数据元素的存储区域之外,尚需设立两个指针front和rear分别指示“队头”和“队尾”的位置。为了在C语言中描述方便,在此我们约…

android 链接分享到朋友圈,android 分享到微信朋友圈或微信好友

一、首先创建一个数字签名(keystore文件)这里不再讲述keystore的创建过程!二、用keystore给app签名,注意最后如下图所示图中的md5就是 申请apkid时所需的 签名,这里需要注意MD5需要将其中的“:”去掉并将其中的大写字母改为小写三…

android studio开源代码,Android Studio Set of source 代码源集

一、源集1、定义:Android Studio 按逻辑关系将每个模块的源代码和资源进行分组,这个分组叫做源集。2、main Module 源集包括其所有构建变体共用的代码和资源。这句话很关键,意思是,所有的其他构建变体,src/main是其共同…

android nougat和安卓7.1,Android Nougat 7.1.2 先睹为快

Android Nougat 的下一个维护版本 7.1.2 即将发布!为了让广大开发者有机会抢先尝鲜,我们从今天开始向已注册 Android Beta 计划、符合条件的设备(包括 Pixel 和 Pixel XL、Nexus 5X、Nexus Player 和 Pixel C 设备)推出公众测试版本。我们还在准备 Nexus…

android app 移植到pc,微软开发新应用把Android app“移植”到Win Phone

依据微软2010年公布在Tweet上的一份专利申请书,微软正在开发一种新服务能够在不同的手机操作系统中“移植”应用和应用数据。这是说Android,iOS应用以后可以跨平台“移植”到 Win Phone Win8系统上?因为Win Phone 著名的“应用问题”&#xf…

鸿蒙系统能否推广,鸿蒙系统凭实力占市场,无需通过禁止安卓系统来推广

有人提议中国应该全面禁用安卓系统,以推广鸿蒙系统(HarmonyOS),甚至还给出了比如安全等理由。确实有这个必要吗?答案是否定的。一、安卓系统是开源系统,不存在被谷歌完全操控而影响到中国安全的问题。实际上安卓系统诸如碎片化、应…

android ut接口介绍,CMCC UT接口(IMS SS)规范说明

OverviewCMCC 关于 UT 部分的说明及规范请参考 "中国移动VoLTE终端技术规范" 中的第6节说明.写在前面: 由于 CMCC 的XCAP server(UT) 和 CS Server(HLR)暂不支持 SS 业务配置SYNC. 因此, 针对支持 UT 的卡, 以及所在城市提供 UT 服务, 则如果某项 SS 业务不支持通过 …

五年级信息技术上册教案计算机主机探秘,第1课信息与信息技术探秘教案

第1课信息与信息技术探秘教案[教学目标]1、知识与技能(1)了解什么是信息、信息传递和信息处理的基本知识。(2)了解信息技术及其应用、发展的基本情况。(3)了解计算机在信息处理中的作用和地位。2、过程与方法以直观的手段让学生初步了解信息和信息技术。…

pc端html轮播带滑块,swiper.js简单快速实现轮播滑动(兼容PC端、移动端)

swiper是一款免费以及轻量级轮播滑动的js框架,适用于PC端跟移动端,官方地址:(https://www.swiper.com.cn/)效果演示:PC端移动端(在浏览器将设备切换为手机,这里切换为iphone),swiper支持移动端触控左右滑动…

html木桶布局,木桶布局 实现

百度图片图片来自 百度图片像这样高度一样,而宽度不同的布局方式称之为木桶布局。它有几个鲜明的特点: 每行的图片高度一致;每行的图片都是占满的。如何实现木桶布局 之 整体思路我们需要先拥有一些素材(图片), 并且将这些图片横向…

如何自己塑封_全球市场三足鼎立,国内半导体封测业如何实现可持续发展?

由于全球半导体市场规模不断增长,终端电子产品需求旺盛,国内半导体封装测试产业迎来了良好的发展机遇。国内半导体封装测试产业如何实现高质量、可持续发展?一时间,半导体封装测试产业再起热议。全球封装测试市场三足鼎立我国半导体封装测试…

博途中用的是c吗_一只“66 鸭”离奇出走,只为助蛋宝宝C位出道

作者 | 欧阳睿 来源 | 4A广告文案对于喜爱蛋黄酥的粉丝来说,一定知道轩妈蛋黄酥,这个在南宁土生土长的蛋黄酥品牌,2015年公司才刚刚成立,如今已坐拥超高人气和口碑,成长为全网类目的TOP1,就连李佳琦也强…

尼奥机器人不能手机绑定_微信绑定的手机号,如果手机号停用,是不是微信也不能用了?...

风水转运算命师未卜先知、指点迷津,助你顺风顺水!商务合作qq:2770794800如果小编现在问你?你在干什么?那么是不是很多人都会说:当然是在刷手机了!我们现在生活中最经常使用的就是手机了&#xf…