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


Posted in Javascript onOctober 20, 2010

以前我一直用的那个(eyecon.ro) 功能完整也简易,但是不尽符合上面的要求,于是 google了N下,结果没找到现成的jquery拾色器插件很好的支持以下功能:

简单易用,仅显示常用的那些色块给用户选择,另外提供一个输入框方便用户输入自定义的色值
于是我写了icolor这个插件,除了支持上面的要求,还有别的一些特性如下:
1,默认提供的色值为“常用的浏览器安全的色值”。相当于整合了下面最后一个prototype版本的颜色拾取器。关于浏览器安全色值,可参考维基文档http://en.wikipedia.org/wiki/Web_colors
2,用户可以自定义常用色值。相当于整合了下面图片中的第7个颜色选择器。
3,用户可根据需要设置是否显示颜色输入框、确认按钮
4,inline模式和popup模式。
5,轻量级、符合xhtml、css2标准。大小只5KB。样式与行为分离。

一,jquery.icolor插件示例
JQuery 拾色器插件发布-jquery.icolor.js
官方地址:http://plugins.jquery.com/project/icolor

示例在这里,http://demo.3water.com/js/icolor/index.html

打包下载地址 https://3water.com/jiaoben/32533.html

二,网上流行的颜色拾取器JS组件

1,原生JS

  • DHTML color picker from Free-color-picker.com

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

  • jsColor

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

2,JQuery插件

  • Farbtastic color picker plug-in

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

  • Color picker by eyecon.ro

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

  • Normal color picker by www.felecan.com

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

  • jQuery color picker by Syronex

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

3,Mootools插件

Moo Rainbow

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

4,Prototype插件

  • Color picker by John Dyer

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

  • Prototype color picker by Myles Eftos

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

Javascript 相关文章推荐
js 自动播放的实例代码
Nov 19 Javascript
教你如何使用firebug调试功能了解javascript闭包和this
Mar 04 Javascript
开启Javascript中apply、call、bind的用法之旅模式
Oct 28 Javascript
如何用angularjs制作一个完整的表格
Jan 21 Javascript
yarn与npm的命令行小结
Oct 20 Javascript
微信小程序 ecshop地址三级联动实现实例代码
Feb 28 Javascript
jquery中封装函数传递当前元素的方法示例
May 05 jQuery
Javascript实现跨域后台设置拦截的方法详解
Aug 04 Javascript
vue组件tabbar使用方法详解
Nov 06 Javascript
JS实现关闭小广告特效
Jan 29 Javascript
jquery选择器和属性对象的操作实例分析
Jan 10 jQuery
CentOS 8.2服务器上安装最新版Node.js的方法
Dec 16 Javascript
Javascript技巧之不要用for in语句对数组进行遍历
Oct 20 #Javascript
来自国外的14个图片放大编辑的jQuery插件整理
Oct 20 #Javascript
理解Javascript_12_执行模型浅析
Oct 18 #Javascript
理解Javascript_11_constructor实现原理
Oct 18 #Javascript
关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别
Oct 18 #Javascript
jQuery Validation实例代码 让验证变得如此容易
Oct 18 #Javascript
jQuery 验证插件 Web前端设计模式(asp.net)
Oct 17 #Javascript
You might like
PHP 网络开发详解之远程文件包含漏洞
2010/04/25 PHP
如何解决CI框架的Disallowed Key Characters错误提示
2013/07/05 PHP
php数组编码转换示例详解
2014/03/11 PHP
PHP中Notice错误常见解决方法
2017/04/28 PHP
php源码的安装方法和实例
2019/09/26 PHP
php实现JWT验证的实例教程
2020/11/26 PHP
基于jquery的多彩百分比 动态进度条 投票效果显示效果实现代码
2011/08/28 Javascript
jquery解决图片路径不存在执行替换路径
2013/02/06 Javascript
JavaScript 动态三角函数实例详解
2017/01/08 Javascript
node.js的事件机制
2017/02/08 Javascript
javaScript实现游戏倒计时功能
2018/11/17 Javascript
微信小程序基于picker实现级联菜单
2019/02/15 Javascript
JS实现字体背景跑马灯
2020/01/06 Javascript
浅谈javascript事件环微任务和宏任务队列原理
2020/09/12 Javascript
[06:53]DOTA2每周TOP10 精彩击杀集锦vol.3
2014/06/25 DOTA
通过python下载FTP上的文件夹的实现代码
2013/02/10 Python
在Django的URLconf中使用命名组的方法
2015/07/18 Python
谈谈如何手动释放Python的内存
2016/12/17 Python
python实现贪吃蛇游戏
2020/03/21 Python
Python实现的登录验证系统完整案例【基于搭建的MVC框架】
2019/04/12 Python
python定时按日期备份MySQL数据并压缩
2019/04/19 Python
使用PyCharm进行远程开发和调试的实现
2019/11/04 Python
将python安装信息加入注册表的示例
2019/11/20 Python
pycharm全局搜索的具体步骤
2020/07/28 Python
程序设计HTML5 Canvas API
2013/04/08 HTML / CSS
详解HTML5中rel属性的prefetch预加载功能使用
2016/05/06 HTML / CSS
John Hardy官方网站:手工设计首饰的奢侈品牌
2017/07/05 全球购物
Clarria化妆品官方网站:购买天然和有机化妆品系列
2018/04/08 全球购物
Nayomi官网:沙特阿拉伯王国睡衣和内衣品牌
2020/12/19 全球购物
医学院学生求职简历的自我评价
2013/10/24 职场文书
自荐信的两点禁忌
2013/10/30 职场文书
小学教师师德整改措施
2014/09/29 职场文书
上课说话检讨书500字
2014/11/01 职场文书
领导欢迎词致辞
2015/01/23 职场文书
校园开放日新闻稿
2015/07/17 职场文书
Selenium浏览器自动化如何上传文件
2022/04/06 Python