请问各位怎么利用js实现文字与背景反色？（实用、赞）

太过爱你忘了你带给我的痛 2022-12-05 13:51 173阅读 0赞

原文出处：[https://zhidao.baidu.com/question/710988923723598245.html][https_zhidao.baidu.com_question_710988923723598245.html]  
代码（有改良）

// 计算反色, ilighten - 减弱对比度(-1 ~ -15)
            // 示例: oppositeColor("#000000", -4); 返回: #bbbbbb
            function oppositeColor(a, ilighten) {
                a = a.replace('#', '');
                //var max16 = 15;
                var max16 = Math.floor(15 + (ilighten || 0));
                if (max16 < 0 || max16 > 15) max16 = 15;
               
                var c16, c10, b = [];
    
                for (var i = 0; i < a.length; i++) {
                    c16 = parseInt(a.charAt(i), 16);    // to 16进制
                    c10 = parseInt(max16 - c16, 10);    // 10进制计算
                    if (c10 < 0) c10 = Math.abs(c10); 
                    b.push(c10.toString(16));           // to 16进制
                }
                return '#' + b.join('');
            }

效果图：  
![20200910173424344.png][]

[https_zhidao.baidu.com_question_710988923723598245.html]: https://zhidao.baidu.com/question/710988923723598245.html
[20200910173424344.png]: /images/20221123/db8b46303f644a91ba57be3cb8b556a1.png

发表评论取消回复

表情：

评论列表（有 0 条评论，173人围观）

还没有评论，来说两句吧...

相关阅读

相关利用iframe嵌入html页面（实用, 赞）

效果图： ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L

Dear 丶/ 2023年06月30日 02:25/ 0 赞/ 9 阅读

相关安卓修改背景色和文字的颜色

1,可以在color.xml中先定义颜色例如下面 <?xml version="1.0" encoding="utf-8"?> <resources> <dr

朴灿烈づ我的快乐病毒、/ 2023年06月25日 08:27/ 0 赞/ 21 阅读

相关 Thress.js设置背景色及背景透明

Thress.js默认背景 Thress.js默认背景色为黑色设置Thress.js背景颜色场景想要自行定义Thress.js模型的背景颜色实现

叁歲伎倆/ 2023年01月15日 13:22/ 0 赞/ 183 阅读

相关请问各位怎么利用js实现文字与背景反色？（实用、赞）

原文出处：[https://zhidao.baidu.com/question/710988923723598245.html][https_zhidao.baidu.com_

太过爱你忘了你带给我的痛/ 2022年12月05日 13:51/ 0 赞/ 174 阅读

相关 WEB-互补色与对比色的计算与获取 (实用、赞）

原文出处：[http://blog.ipodmp.com/2014/03/web-and-calculation-of-complementary-and-contrastin

我就是我/ 2022年12月05日 12:08/ 0 赞/ 164 阅读

相关根据背景图片计算文字颜色（实用、赞）

原文出处: [https://www.it1352.com/533401.html][https_www.it1352.com_533401.html] 延伸阅读： 1

系统管理员/ 2022年12月05日 00:54/ 0 赞/ 198 阅读

相关 js 实现数组元素交换位置（实用、赞）

原文出处：[https://www.cnblogs.com/dearxinli/p/6802151.html][https_www.cnblogs.com_dearxinli_

忘是亡心i/ 2022年10月05日 09:57/ 0 赞/ 535 阅读

相关利用css实现背景半透明，文字不透明。

利用css3新增的rgba属性，在新增filter属性兼容ie6、7、8浏览器 .div{ color:white; background-color:rgba(0,

港控/mmm°/ 2022年06月16日 06:24/ 0 赞/ 298 阅读

相关 CSS 实现背景色渐变和文字颜色渐变

1. 背景色渐变 A . linear-gradient：用线性渐变创建图像。语法：<linear-gradient> = linear-gradient(\[ \[ [

小咪咪/ 2022年04月01日 08:38/ 0 赞/ 678 阅读

相关实用色轮图（赞、实用）

原文出处：[https://www.jb51.net/photoshop/228718\_2.html][https_www.jb51.net_photoshop_228718

痛定思痛。/ 2021年12月12日 13:45/ 0 赞/ 314 阅读