js颜色加深或者减淡

/**************************颜色处理***********************************///hex颜色转rgb颜色function HexToRgb (str) {var r = /^\#?[0-9A-F]{6}$/;//test方法检查在字符串中是否存在一个模式，如果存在则返回true，否则返回falseif (!r.test(str)) return window.alert("输入错误的hex");//replace替换查找的到的字符串str = str.replace("#", "");//match得到查询数组var hxs = str.match(/../g);//alert('bf:'+hxs)for (var i = 0; i < 3; i++) hxs[i] = parseInt(hxs[i], 16);//alert(parseInt(80, 16))//console.log(hxs);return hxs;}//GRB颜色转Hex颜色function RgbToHex (a, b, c) {var r = /^\d{1,3}$/;if (!r.test(a) || !r.test(b) || !r.test(c)) return window.alert("输入错误的rgb颜色值");var hexs = [a.toString(16), b.toString(16), c.toString(16)];for (var i = 0; i < 3; i++) if (hexs[i].length == 1) hexs[i] = "0" + hexs[i];return "#" + hexs.join("");}//得到hex颜色值为color的加深颜色值，level为加深的程度，限0-1之间function getDarkColor(color, level) {var r = /^\#?[0-9A-F]{6}$/;if (!r.test(color)) return window.alert("输入错误的hex颜色值");var rgbc = this.HexToRgb(color);//floor 向下取整for (var i = 0; i < 3; i++) rgbc[i] = Math.floor(rgbc[i] * (1 - level));return this.RgbToHex(rgbc[0], rgbc[1], rgbc[2]);}//得到hex颜色值为color的减淡颜色值，level为加深的程度，限0-1之间function getLightColor(color, level) {var r = /^\#?[0-9A-F]{6}$/;if (!r.test(color)) return window.alert("输入错误的hex颜色值");var rgbc = this.HexToRgb(color);for (var i = 0; i < 3; i++) rgbc[i] = Math.floor((255 - rgbc[i]) * level + rgbc[i]);return this.RgbToHex(rgbc[0], rgbc[1], rgbc[2]);}/****************************颜色处理结束**************************************/

js颜色加深或者减淡相关推荐

JavaScript颜色加深或减淡
效果图: 最近项目中地图需要鼠标进图图块时颜色高亮显示,于是接触了颜色加深或减淡的知识,遂记之. /**************************颜色处理******************** ...
opengl实现PS中部分图像处理效果-正片叠底、逆正片叠底、颜色加深、减淡
效果图正片叠底shader varying vec2 V_Texcoord;uniform sampler2D U_BaseTexture; uniform sampler2D U_BlendTex ...
html图片颜色加深,PS图层混合模式解析：变暗/正片叠底/颜色加深/线性加深/深色...
之前,我们对使底层图像变亮的模式"变亮"."滤色"."颜色减淡"."线性减淡"与"浅色"有了相应的了 ...
css实现滚动时选中区域字体颜色加深
在封装日期选择器时,需要选中时字体颜色加深,先看一下实现后的效果可以看到加深的不是整个文字,而是中间那片区域今天聊的重点不在选择器的封装,主要看这个样式效果,想了解此组件的实现思路可以看之前的文章 ...
HarmonyOS：实现Button按下后颜色加深的效果
目录一.实现效果二.Android开发三.HarmonyOS开发四.比较一.实现效果二.Android开发在安卓中利用selector可以实现Button的点击效果,布局文件如下所示 ...
计算机打印时颜色怎么加深,喷墨打印机部分颜色加深怎么办
喷墨打印机部分颜色加深怎么办喷墨打印机有部分颜色加深什么情况? 方法/步骤曝光灯管损坏.首先观察曝光灯是否发光,不发光时可检查灯脚接触是否良好.是否为曝光灯管损坏.断线或灯脚与灯座接触不良等原因. ...
ant design Modal遮罩层颜色加深解决方案
ant design Modal遮罩层颜色加深解决方案参考文章: (1)ant design Modal遮罩层颜色加深解决方案 (2)https://www.cnblogs.com/ruoshu ...
Dcat-Admin框架JS颜色管理--Dcat-Admin框架实战(十六)
目录一.颜色管理文件位置二.介绍颜色函数 1.获取内置颜色代码 2.颜色淡化小探究(JS加不加分号?) 3.深化颜色小发现(深化/淡化其实是一个函数?) 4.颜色透明化 5.获取所有内置颜色 ...
html图片颜色加深,CSS教程：图片使用混合模式和颜色叠加filter滤镜，改变PNG图标颜色...
目前很多网站使用PNG来做图标,那么能否通过CSS更改其颜色? 从而适应不同的网站风格? 混合模式 css3添加了两个与混合模式相关的属性: mix-blend-mode,background-ble ...

js颜色加深或者减淡

js颜色加深或者减淡相关推荐

最新文章

热门文章