位置:首页 » 教程 » 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

最新文章
  • 求送个小米3的F码,那个好心人送一下吧

    求送个小米3的F码 抢好几个星期了又一直抢不到. 家里人又一直想要. 那个好心人送一个吧 Email: 6ird1217#gmail.com --cut--

  • PS利用外挂滤镜打造大气的秋季风景大片 PS利用外挂滤镜打造大气的秋季风景大片

    借助外挂滤镜调色是非常快的,很多经典色调都是一步到位;不过初学者不能过渡依赖外挂,尽量在PS中尝试去完成,这样能提高自己的设计水平. 原图 最终效果 这张照片是在位于婺源程村一侧的山腰上拍摄的,时间大约是早上的7点15分,太阳刚刚从正对面的山边露出头来.通过ACR打开原片,参数一目了然(如图1所示).拍摄机型Canon 5D III,光圈f/8.0,快门1/200,使用的镜头数据是三脚架支撑的小白兔的85mm焦段. 程村每天早晨为了应对来自世界各地的影友,家家户户都要在门口放烟(在村里实地了解才

  • 怎么禁止执行清空Windows系统“回收站”操作

    如果想禁止他人清空你windows xp系统桌面的"回收站",可以对注册表进行如下操作. 第1步:打开注册表编辑器,依次展开HKEY_CLASSES.ROOTCLSID{645FF040-5081-101B-9F08-00AA002F954E}InProc-Server32子键. 第2步:在右侧窗口中将"默认"键值项的值改为"shell32.dll-"即可"锁定回收站",如下图所示. 第3步:关闭注册表编辑器并重新启动xp系统

  • 立春养生之道 立春养生之道

    在养生上主要是护肝.在作息时间上,人们也应顺应自然界的规律,晚睡早起.在精神养生方面,要力戒暴怒,更忌忧郁,做到心胸开阔,保持心境愉悦. 对于健康人群而言,饮食要清淡,不要过度食用干燥.辛辣的食物.同时,因为此时阳气上升容易伤阴,所以要特别注重养阴,可以多选用百合.山药.莲子.枸杞等食物. 立春之后的一段时间往往冷暖不定,要当心"倒春寒"的侵扰,特别是对于体弱的人来说,感冒.发烧是常有的事情.对此专家表示,要想杀菌并防寒,在饮食上可增加吃大蒜.洋葱.芹菜等"味冲"食

  • 大学生网上开店完全攻略

    不用高额的投资.不用花费大量的时间,只需在网上点击鼠标就可以自己当老板,学习之余有另一番体验. 如今不少大学生认为,网上开店可以锻炼个人能力,积累经营经验.另外,由于资金缺乏.经验不足是自主创业的最大难题,而网上开店却能在一定程度上"扬长避短".所以,成本低.回报快.容易操作的网上开店眼下已经风靡各大高校. 校园BBS成"风水宝地" 现在,各大高校BBS都有专门的版块给学生商家免费做广告.发布信息等,比如北大未名BBS的"ADAgent"(商务广

  • 小谈摄影者与拍摄对象间的关系 小谈摄影者与拍摄对象间的关系

    战地摄影师Robert Capa有句经典名言:"如果你的照片不够好,那是因为你靠得不够近."作为摄影者,你是否曾思考过,要多"近"才是足够?什么才是真正意义上的"近"?无论什么题材,自己又是如何衡量或拿捏与拍摄对象间的关系的?一起来听杨军谈谈他的见解. ▲阿其:露宿八年,家人已经全都去世."最喜爱在枫树街公园睡觉,不过只能坐着睡."(摄影师:陈巧真) 不是生理靠得不够"近" 二十世纪著名战地摄影记者,也是马

  • Illustrator制作炫彩的教师节粉笔字教程 Illustrator制作炫彩的教师节粉笔字教程

    先看下效果图: 1.新建图层,填充一个自己喜欢的底色,例如靛青色的黑板: 2.输入文字,添加新填色: 3.选中文字,在窗口执行 效果>风格化>涂抹,参数如下图: 4.给文字添加个描边,效果完成

  • 教你如何在WindowsXP系统下新建宽带连接 教你如何在WindowsXP系统下新建宽带连接

    打开"新建连接向导",如图,直接点击"下一步".打开向导的方法有很多种,在这里介绍一种简单的:开始→所有程序→附件→通讯→新建连接向导. 选第一项,"下一步". 选第二项,继续"下一步". 选第二项,"下一步". 这一项中的ISP名称,可以填也可以不填,不填即缺省的"宽带连接".这里不填. 此步中,为了快速,用户名和密码以及确认密码均不填写.但是不要忘记给下面的两个选项打上勾. 为&qu

  • 网站建设新手指南向导

    学习编写HTML代码 已经有了网站设计软件顺序来编写HTML代码,也许会奇怪.为什么还要学习如何编写自己的HTML代码呢?因为并不能完全依赖于网页设计编辑器,必要的时候,还需要有能力编写HTML代码.编辑器可能无法加入特殊效果.如果这样,例如.就需要自己编辑HTML代码.也有时候,会希望使用脚本如JavaScriptCGI或PHP特殊效果添加到网页.一些如JavaScript脚本,直接放置在HTML代码中.如果你对HTML一无所知,将不能完成这样的任务. 使用网站设计软件 需要将它放置在Web服

  • 亚马逊砍价功能怎么用? 亚马逊砍价功能怎么用?

    亚马逊此前的两次"发错货.免费送"更像是一次有意的营销宣传,现在他们又推出了一项切实"惠民"的新功能:Make an Offer(还价). 据了解,如果消费者认为第三方卖家的商品价格过高,可与卖家议价,这样就可能以低于商品最初定价的价格买到该商品. 当然,卖家有接受和拒绝的权利.一般来说,买家提出砍价之后,卖家有三天时间作出回应.议价为私下进行,别的买家无法看到. 据亚马逊表示,目前大约有15万件商品能够提供"议价"功能,但大多都是艺术品.收藏品

热门推荐
  • 天天酷跑疾跑嘉年华8月上线 活动积分应兑换什么 天天酷跑疾跑嘉年华8月上线 活动积分应兑换什么 天天酷跑即将开启新版本活动疾跑嘉年华,玩家们可通过多种途径获得嘉年华入场券,参与活动可以获得对应的活动积分,兑换丰富的奖励.一起来看看吧! 活动开启时间:8月1日 活动规则: 1.所有更新天天酷跑嘉年华版本的玩家,都可以参与本次活动. 2.在疾跑嘉年华活动关卡中,超级奖励关卡会飞出彩球,大家吃掉以后就可以获得小丑头像,收集到的小丑头像用来兑换奖品. 3.嘉年华活动需要入场券,活动期间,大家可以通过多种途径获得嘉年华入场券. 4.嘉年华活动关卡中,开局冲刺效果不会生效,所得入场券与小丑会在活动结束
  • 邱宏德:神州信息金融云就像IT餐厅 可让银行点餐 邱宏德:神州信息金融云就像IT餐厅 可让银行点餐 7月25日,神州数码信息服务股份有限公司(简称:神州信息)旗下子公司神州数码融信软件有限公司(以下简称"神州数码融信")副总裁兼金融云服务中心总经理邱宏德日前在接受和讯科技采访时表示,神州数码融信"金融云服务"其实就是银行(村镇银行等小微金融机构)的IT餐厅,我们提供了很多菜,有标准菜单,也有特殊菜单.银行购买我们的服务,并支付相应的费用. 据和讯科技了解,截至目前,神州数码融信"金融云服务"签约客户已达80多家.邱宏德预计,2013年年底签约客
  • 高材生留摩斯密码离家出走 找我先破解吧 高材生留摩斯密码离家出走 找我先破解吧 一张摩斯电码写的留言条 让家长抓狂了 图中的这些符号,是桐乡一个高二男生写的,最下面还有一行字:"想知道我在哪儿吗?破解吧!" 将这张留言条放在家中的电脑键盘上,这孩子便消失了. 高二男生没去学校 而是上了开往杭州的大巴 杨彬(化名)今年17岁,桐乡石门镇人,在桐乡市区一所高中读二年级.每周日上午,他都会从羔羊镇乘坐公交车,到桐乡市区下车,再转到学校. 11月3日上午,杨彬妈妈看到儿子起得比平时早,就问他为何早起,儿子说去学校有点事.随后,杨彬步行去羔羊集镇上乘公交车. 当天下午1点多
  • 常吃番石榴的10个好处 常吃番石榴的10个好处 常吃番石榴的10个好处 你知道吃番石榴有什么好处吗?番石榴含有大量的钾.铁.胡萝卜素等,营养极其丰富;可是对于这么营养的番石榴,我们吃了会有什么好处呢?下面告诉你吃番石榴有什么好处. 1.降血糖 番石榴有降血糖作用,对糖尿病患者有独特的功效;含纤维高,能有效的排走积存在肠内的宿便. 2.收敛,涩肠 石榴味酸,含有生物碱.熊果酸等,有明显的收敛作用,能够涩肠止血,加之其具有良好的抑菌作用,所以是治疗痢疾.泄泻.便血及遗精.脱肛等病症的良品. 3.解酒 番石榴果实富含维生素C.铁.钙.磷等矿物质,补