jQuery颜色选取器插件COLPICK

所属分类:输入-拾色器

 46237  33  查看评论 (19)
jQuery颜色选取器插件COLPICK ie兼容8

没有图像 !只是 JS 和 CSS 文件

非常直观类似 Photoshop 的界面

光明和黑暗很容易自定义 CSS3 外观

28 KB 总由浏览器加载看起来不错甚至在 IE7及工程非常容易实现

截图

用法

下载该插件和 colpick.js 和 colpick.css 添加到您的文档的头:

<script src="js/colpick.js" type="text/javascript"></script>
<link rel="stylesheet" href="css/colpick.css" type="text/css"/>

现在你可能会在任何 jQuery 对象来创建一个颜色选取器上调用colpick方法。默认情况下您获取下拉列表颜色选择器:

html

<button id="picker">Show Color Picker</button>

js

$('#picker').colpick();

选项

传递给 colpick 函数作为对象的几个选项允许您自定义颜色选择器。例如,传递flat:true使颜色选取器总是可见的如下面的示例。

html

<div id="picker"></div>

JS

$('#picker').colpick({
    flat:true,
    layout:'hex',
    submit:0
});
相关插件-拾色器

jQuery颜色选择插件evol.colorpicker

一个简单的颜色选择工具evol.colorpicker,使用jquery开发
  拾色器
 4604  25

jquery颜色选择插件Spectrum

jquery颜色选择插件Spectrum
  拾色器
 8522  23

colpicker取色器兼容不同jquery版本

很方便的colpicker取色器,自己修改了下兼容不同的jquery版本
  拾色器
 2535  11

WEB颜色选择器

WEB颜色选择器可以基于网页格式选择颜色色值的方法.
  拾色器
 9591  45

讨论这个项目(19)回答他人问题或分享插件使用方法奖励jQ币

    ι 瞬间 0
    2017/3/15 14:43:42
    lylrian 0
    2017/2/19 16:03:14

    @microsoftvs 你好 请教个问题,放在情境下 table追加一行中 效果没有;

    代码如下:

    // 获取id为tab的table表单    
    var tab = document.getElementById('table_test');
    // 获取id为x的行号,在x的行号上加一作为插入行的行号     
    var n = document.getElementById('tr_1').rowIndex + 1;
    // tr为tab表单下行号为n的行     
    var tr = tab.insertRow(n);
    var td = tr.insertCell(0);
    td.innerHTML = '<div class="color-box"><input type="hidden"/></div>';
    回复
    溪山行旅 0
    2016/11/7 9:11:41
    一点右边的内容直接框掉了咋回事呢 回复
    鸡蛋拉肠 0
    2016/11/1 14:11:20
    默认颜色如何动态变化 回复
    晨曦 0
    2016/8/12 10:08:37
    完全不会用,加上了但是无法变色 回复
    wesleyzhang 0
    2016/6/14 11:06:21
    Striver 0
    2016/3/25 12:03:44
    希望压缩包里可以添加实例 回复
    莫语21 0
    2016/1/27 14:01:52
     怎么修改拾色器默认颜色
        microsoftvs0
        2016/1/27 15:01:02

        colpick.js中

        color: '3289c7',
    回复
    苏晓慧 0
    2016/1/20 13:01:13

    为什么有时候选取不了颜色,点击颜色面板没反应???

    回复
    小薏3333 0
    2015/10/8 14:10:05

    怎么修改加载时默认颜色

    回复
取消回复