位置:首页 » 教程 » JS实现的网页上的颜色拾色器

JS实现的网页上的颜色拾色器

日期:2016-04-01 阅读:0num
Advertisement

使用Js代码编写一个网页上用的颜色拾色器,也就是选择颜色用的,用鼠标单击任意颜色块,将弹出颜色值,当你想使用某种颜色而不知道颜色值的时候,用这个小特效可以告诉你颜色值是多少,比较方便。

颜色拾色器

红 绿 蓝 灰
用鼠标单击下面的颜色块,将弹出颜色值

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

相关文章
  • JS实现的网页上的颜色拾色器

    使用Js代码编写一个网页上用的颜色拾色器,也就是选择颜色用的,用鼠标单击任意颜色块,将弹出颜色值,当你想使用某种颜色而不知道颜色值的时候,用这个小特效可以告诉你颜色值是多少,比较方便. 颜色拾色器 红 绿 蓝 灰 用鼠标单击下面的颜色块,将弹出颜色值 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • js实现在网页上简单显示时间的方法

    这篇文章主要介绍了js实现在网页上简单显示时间的方法,实例分析了javascript实时显示时间的技巧,需要的朋友可以参考下 本文实例讲述了js实现在网页上简单显示时间的方法.分享给大家供大家参考.具体如下: 这是一款网页时钟JS代码,纯javascript实现,显示时.分.秒.网页时间显示.网页时钟有很多,这个真的挺简易的,美工好的朋友可在此基础上进一步美化完善 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional

  • js实现在网页上简单显示时间的方法教程

    本文实例讲述了js实现在网页上简单显示时间的方法.分享给大家供大家参考.具体如下: 这是一款网页时钟JS代码,纯javascript实现,显示时.分.秒.网页时间显示.网页时钟有很多,这个真的挺简易的,美工好的朋友可在此基础上进一步美化完善 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transit

  • 运行此js时提示网页上有异常,请教错在哪里

    运行此js时提示网页上有错误,请问错在哪里? <script language= "javascript " type= "text/javascript "> function page(value){ var $s = location.search; var $t; if ( value > 0) { $s.indexOf( "page= ") > 0 ? $t = $s.replace(/page=([0-9]{0

  • 利用JS代码在网页上绘图,该怎么处理

    利用JS代码在网页上绘图 目前我学习制作一个利用C#浏览器控件,通过代码和网页中的JS代码交互,使得网页上动态绘制图形. 主要只用画出简单的点,线段即可. 我之前了解到,利用html5的canvas可以实现该功能,如moveto lineto, 但是我发现canvas必须使用IE9以上才可以, 我想用使用更低版本的浏览器也可以兼容, 所以想请问有没有其他方法实现我所说的功能. 分享到: ------解决方案-------------------- 如果只需要支持IE浏览器的话,建议采用VML,绝

  • JQuery 拾色器插件发布-jquery.icolor.js JQuery 拾色器插件发布-jquery.icolor.js

    以前我一直用的那个(eyecon.ro) 功能完整也简易,但是不尽符合上面的要求,于是 google了N下,结果没找到现成的jquery拾色器插件很好的支持以下功能: 简单易用,仅显示常用的那些色块给用户选择,另外提供一个输入框方便用户输入自定义的色值 于是我写了icolor这个插件,除了支持上面的要求,还有别的一些特性如下: 1,默认提供的色值为"常用的浏览器安全的色值".相当于整合了下面最后一个prototype版本的颜色拾取器.关于浏览器安全色值,可参考维基文档http://en

  • jQuery soColorPacker 网页拾色器

    未采用生僻的jquery特性,能兼容jquery1.2.6以上所有版本 实例预览 引入文件 <link type="text/css" rel="stylesheet" media="all" href="soColorPacker/css/style.css" /> <script type="text/javascript" src="jquery1.8.0.min.js&q

  • 用纯js打造拾色器无法实现循环点击onclick

    用纯js制作拾色器无法实现循环点击onclick 网上是有很多拾色器代码,但是我是新手,想用纯js制作拾色器,代码如下. 问题是我如果一个一个触发onclick事件内容输出没有问题,但是假如for语句,就提示undefined <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> #container{

  • iOS软件iWheelColor:装在口袋里的拾色器 iOS软件iWheelColor:装在口袋里的拾色器

    颜色代码对于程序员和网页设计师来说非常重要,但如果不是在电脑旁,那么多的颜色代码一定不好记,也不容易查看效果.所以就有贴心的国外开发商推出了一款名为iWheelColor的辅助软件. iWheelColor 点击进入下载界面 iWheelColor iWheelColor是一款拾色器软件,它可以让平面设计师.程序员和网页设计师等工作者非常直观和正确的找到颜色组合.我们在软件的主界面上可 以看到一个色彩轮,可以随意用手去触摸滑动或是改变.iWheelColor既支持2种颜色的互补,也支持三个颜色的

  • JavaScript奇效实例012-网页拾色器

    JavaScript特效实例012-网页拾色器 实例012 网页拾色器 实例说明 在网站中经常需要用户自定义颜色来显示某些信息.这可以在网页添加一个拾色器来实现. 技术要点 在本实例中仅使用216种浏览器安全的颜色,即所谓的Netscape色块.这216种颜色分别代表0.51.102.153.204这5个颜色值以及每一种原色(即红.绿.蓝).这些十进制数值对应的十六进制数分别为0x00.0x33.0x66.0x99.0xCC和0xFF.在HTML的颜色属性中黑色是#000000,纯红色是#FF0

  • Linux下拾色器:功能强大的gpick Linux下拾色器:功能强大的gpick

    以往在 Linux 下要拾个颜色啥的我一直用 gcolor2 应付着.不过话说回来,gcolor2 的功能实在有些弱.现在有了功能更加强大的 gpick,gcolor2 可以正式"下岗"咯. 且让我们来看看 gpick 有些啥好功能: 在放大的屏幕区域中,按空格键即可快速取色: 为拾取的颜色自动命名: 能够将拾取的颜色以不同格式拷贝到剪贴板,目前包括十六进制.RGB 及 HSL: 可以将拾取的颜色导出为调色板,支持 gpl.ase.mtl 等格式,以供 GIMP.Inkscape 等程

  • HTML 拾色器

    获取 暗/明 渐变颜色效果.

  • js随机生成网页背景颜色的方法教程

    本文实例讲述了js随机生成网页背景颜色的方法.分享给大家供大家参考.具体实现方法如下: 代码如下: <HTML> <HEAD> <TITLE>随机生成网页背景颜色的JS特效</TITLE> <STYLE> .30pt{font-size:30pt;color:#de3076} </STYLE> <SCRIPT LANGUAGE="JavaScript"> <!-- color=new Array(

  • js随机生成网页背景颜色的方法

    这篇文章主要介绍了js随机生成网页背景颜色的方法,涉及javascript操作背景色的技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了js随机生成网页背景颜色的方法.分享给大家供大家参考.具体实现方法如下: 代码如下: <HTML> <HEAD> <TITLE>随机生成网页背景颜色的JS特效</TITLE> <STYLE> .30pt{font-size:30pt;color:#de3076} </STYLE> <

  • JS文件中的中文在网页上显示为乱码解决方法 JS文件中的中文在网页上显示为乱码解决方法

    JS编码转换,这句话本身就是一句具有二重义的话.通常理解为JS文件里能转换编码的代码,但是,我所碰到的问题并不是这样的,是要解决JS文件本身的编码问题,它是UTF-8编码的还是ANSI编码的?在百度.谷歌上一搜,大家都是说通过JAVA后台处理来解决编码问题,试问,这样能解决JS文件本身的编码问题吗? 之所以提出JS文件本身编码问题,是因为JS文件的编码不同,造成了中文显示为乱码. 通常,在Eclipse中建立一个JS文件(含有中文),在Eclipse的编辑器中看到的中文都很正常,但是显示在网页上

  • 网页上播放mp3或flash的js代码

    本文章来介绍利用object实现可控制的网页上播放mp3的js代码,有需要的朋友可参考. 先来介绍media player控制,对应控件 <object classid="clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6" 后面我们会有讲到. 例1 代码如下 复制代码 <object id="player1" type="application/x-oleobject" height="3

  • 网页上展示日历(js)

    网页上显示日历(js) <head runat="server"> <title></title> <%-- 用JS/connotation.js方法时要在下面写两段代码,并且在文本框下要有一个层用来放日历--%> <script src="JS/connotation.js" type="text/javascript"></script> <script type=

  • 高分坐待求解答,别人网页上的Js复制一下就会失效,好奇怪

    高分坐等求解答,别人网页上的Js复制一下就会失效,好奇怪. http://www.quakemachinex.com/blog/wp-content/plugins/clean-archives-reloaded/ajax-single.php?postid=215 看此贴,无毒的... 把里面的js代码复制到本地,然后你试试自己写一个类似的host上去,不会转换. 但是作者的那些实例,你复制,却成功了,百思不得其解.... ------解决方案-------------------- 在 te

  • 这个远程XML如何解析到网页上? 用JS 或者ASP都可以

    这个远程XML怎么解析到网页上? 用JS 或者ASP都可以 本帖最后由 phpkakaok 于 2013-07-02 15:28:53 编辑 <?xml version="1.0" encoding="utf-8"?><soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/" xmlns:xsi="http://www.w3.org/200

  • 如其通过java调用JS获取网页上的内容

    如果通过java调用JS获取网页上的内容? HTML源码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><tit

最新文章
  • 关于google reader+postrank的一个问题

    求助 之前一直用的postrank才没淹没在rss里 但貌似实效很久了 你们都用的什么? --cut-- caomu在2012-06-10 14:14:0回答到: pr貌似被google收购后就死掉了... 信息过载确实很蛋疼,总之各种人有各种解决方法,我是尽量加快扫读速度,看标题.有人比较极端,退订,或者干脆不用gr,就靠社交网络. 怀念有玩聚的日子. SuperOS在2012-06-10 14:17:3回答到: @caomu 我现在也是快速扫描 但总感觉会漏掉什么... shawn_gong

  • 拔牙后如何护理口腔? 拔牙后如何护理口腔?

    拔牙术是口腔科最常用的手术.由于拔牙是在有唾液和存在大量微生物的环境下进行的,因此,如同外科手术,拔牙后的护理绝不应该看成为简单的要求,而应严肃对待. 作为拔牙病人,懂得一些拔牙后的正确护理,不仅有利于拔牙创的良好愈合,而且可以防止许多拔牙后并发症的出现. 首先,拔牙后纱布咬合非常重要. 在临床上,我们常常会碰到病员会问:纱布咬多少时间吐掉?我们说,牙拔除后拔牙创即为新鲜血液充满,约于15分钟便形成血凝块,将创口封闭.所以正确纱布咬合所咬时间为30分钟.不宜过早,也不宜过迟. 提前取出血凝块未形

  • 菊花茶这么喝才养生 菊花茶这么喝才养生

    工作学习之时,很多人都喜欢在案头沏一杯菊花茶,酒店餐馆也总少不了它的身影.然而,你对菊花茶的了解有多少呢? 黄菊散热,白菊明目.菊花气味清香.凉爽舒适,味辛.甘.苦,微寒,归肺.肝经.现在市面上的菊花有黄.白菊两种,疏散风热宜用黄菊花,可防治风热感冒;平肝.清肝明目宜用白菊花,可用于头痛眩晕等症状.还有一种野菊花,其花朵较小较黄,花形也不是很好看.野菊花清热解毒的作用最强,对缓解生疮.牙痛.口臭都有效. 随泡随饮.菊花茶中富含黄酮类物质,具有很好的抗氧化性能,能帮助人体清除体内自由基,有降低胆固

  • 判断一个女人爱不爱你的标准

    有一位女友,是朋友圈里公认的情感专家.朋友们所有的情感问题:热恋,失恋,暗恋,三角恋,到了她那儿,只需稍加点拨,便统统迎刃而解.于是便想,这样精明伶俐的女子,倘若爱了,必定是优雅从容风情无限.如果说爱情是场战争,那么她自然便是两军对垒时指挥三军的大帅,或进或退,或松或紧,挥洒自如,游刃有余.可事实上,到后来她自己真正投入地爱了时,却全然换了另一副模样. 她一天十几遍地缠着他问:"你爱我吗?有多爱呢?"得到他肯定的答复,便笑逐颜开,欢欢喜喜地去为他洗手做羹汤:倘若他有丝毫的怠慢和厌倦,她

  • 金立ELIFE s5.1如何删除手机安装的软件? 金立ELIFE s5.1如何删除手机安装的软件?

    1.打开手机菜单中的"设置"选项; 2.选择"应用程序" 3.选择"应用程序管理",在所列的所用应用程序中选择自己要删除的程序. 4.点击删除按钮,而后点击确定,就能够顺利把程序删除了.

  • PS超强抠图合成创意教程 PS超强抠图合成创意教程

    最终效果图 素材图 1.为了保证最终图像的清晰,我们需要把图像放大,在完成抠图之后再把图像缩小回原始大小.注意这里的"放大"不是用放大镜工具放大观看,而是将图像整体用"图像"-"图像大小"命令放大,如图所示,将单位改为百分比,勾选"约束比例",把图像宽高都设置为原来的400%,单击好,图像被放大. 2.下面这一步,将对图像进行破坏性的操作.由于本实例只是将素材作为一个辅助设计的图像来对待,所以没有将背景层复制.如果大家是要抠取

  • 王卡卡:站长如何应对网站改版

    最近好多站长都在群里提到自己的网站需要或者准备改版,出现这种情况的大部分原因做网站之前没有好好的策划最终导致现在网站不能满足运营的需求,但是我们都知道搜索引擎对改版的网站是十分敏感的,往往会伴随的是网站被降权,所以改版之前我们就应该认真的策划如何尽量一次性就把我们的网站改版好,把由于改版给我们带来的发方方面面的损失减少到最低. 1.网站改版的速度一定要快 改版之前可以先在本地把所有的页面和程序都调试好,然后在现有网站上提前通知用户网站会改版,以免引起不必要的误会,最后可以选择凌晨迅速把网站所有的

  • PS结合数位板鼠绘漂亮的羽毛公主 PS结合数位板鼠绘漂亮的羽毛公主

    效果图中包含的羽毛是非常多的,每一片羽毛形态.颜色.细节等有很大不同,复制的方法是行不通的,每一片羽毛都需要自己手工完成,绘制的时候一定要有耐心. 最终效果 1.photoshop教程草图:首先打开PS,选用"喷枪钢笔不透明描边"即19号笔刷,画出线稿. 2.再大致的确立一下明暗关系即可. 3.给画面设定一个整体基调,在这里我选用了梦幻的蓝色.基本上我平时画图只用"喷枪钢笔不透明描边19号"和"喷枪柔边圆形"这两个笔刷. 4.铺色:为了使整个画面

  • 我叫MT2史诗武器来袭 快速获得碎片有技巧 我叫MT2史诗武器来袭 快速获得碎片有技巧

    我叫MT2手游史诗武器怎么获得?史诗武器由不同的史诗武器碎片合成而来,作为游戏中的终极装备,能激活特殊技能,在竞技场中能轻松虐杀对手,那么在游戏中怎么才能获得这么炫的史诗武器呢?下面跟着小编一起来看看. 我叫MT2史诗武器指哪些? 史诗武器可以理解为最高级的装备,不同的英雄能装备不同的史诗武器 我叫MT2史诗武器有啥用? 1.史诗武器不仅拥有绚丽的外形,还能不停升级,升级后可以激活该武器对应的特殊技能!!竞技场要是阵容上的英雄都有史诗武器,并激活特殊技能,对付其他玩家简直是压制呀!! 2.未来史

  • dwr 前台调用后台老板的java类 hello

    dwr 前台调用后台的java类 hello dwr 前台调用后台的java类 hello web项目,service tomcat 第一部:在web.xml中引入dwr类库 web.xml <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http:/

热门推荐
  • textarea中的手动换行处理的jquery代码 textarea中的手动换行处理的jquery代码 网上众说纷纭,经过测试用 textarea的内容.replace(/\n/g, "<br/>") 解决问题,在IE6/7/8/9 Firefox/3.6.13 chrome10.0.648.82下测试通过,示例代码如下: 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  • 《崩坏学园2》祈愿活动:圣殇之魂 《崩坏学园2》祈愿活动:圣殇之魂 崩坏学园2祈愿活动:圣殇之魂 灵魂的喘息,灵魂的救赎.灵魂的毁灭与升华,无人知晓灵魂最终的归属,也许就是崩坏之源的最深处...... 圣殇是一种神圣的仪式,是寻找灵魂至纯之地的征途.少女们为了寻找阻止崩坏之源的方法,不断的净化着永不停歇的圣洁之灵. 圣洁至纯之魂最终的归属之地在那里,少女们双手合十呐呐细语开始神圣的祈愿.得到至纯之魂的祝福,纯白之羽为少女们带来无尽的神秘力量,幻化出无与伦比的至强装备. 活动时间:截止至2月12日24:00 活动内容:活动期间,在公主的祈愿和大小姐的祈愿中,得到圣
  • 如何移除平板中无效应用图标 如何移除平板中无效应用图标 之前在使用安卓平板的过程中碰到了使用LBE禁用应用后,应用图标还显示在应用列表中的情况.经过平板盒子小编的探索,找到了移除无效应用图标的方法. 一次打开设置→应用,并选择显示全部应用, 找到无效的应用,然后选择打开该应用,可看到如下图的界面, 选择清除数据,然后停用该应用,退出设置后你就能看到无效的应用图标被移除了. 注:更多精彩教程请关注本站电脑教程栏目,本站电脑群:189034526欢迎你的加入
  • 网吧U盘被限制如何开启 网吧U盘被限制如何开启 第一步,插入U盘之后,在电脑上登入一个QQ号,直接登入QQ音乐或者从QQ内登入. 第二步,登入QQ音乐之后,点击音乐界面右边的本地管理. 第三步,点击本地管理之后,再点击最右边的向下拉标记,弹出下拉菜单; 第四步,点击下拉菜单之中的"添加本地歌曲文件夹",弹出导入菜单; 第五步,点击其中的"我的电脑",然后在其中找到自己U盘的盘符,点击打开就可以; 第六步,如果你一开始没有发现自己U盘的盘符,那么请重新拔掉U盘再插入,一般而言要先插U盘再打开QQ音乐,顺序颠倒有可能