cxColor 是一款颜色选择器。这样的插件使用场景不多。可喜的这是国人写的。

官方网站: https://github.com/ciaoca/cxColor

使用方法:

1、引入jquery库

2、引入cxColor的css和js

1
2
<link rel="stylesheet" href="css/jquery.cxcolor.css">
<script src="js/jquery.cxcolor.min.js"></script>

3、创建cxColor颜色选择器

官方网站demo是使用input组件,官方网站没说明,在些特别提醒下。

添加input组件

1
<input id="color_a" name="mycolor" type="text" class="input_cxcolor" readonly>

再使用cxColor()构造函数创建cxColor实例

1
$('#color_a').cxColor();

还有更高级的用法,如在创建实例时设置默认颜色。参考官方源码  https://github.com/ciaoca/cxColor

<!DOCTYPE html5>
<html>
<head>
<title>颜色选择器</title>
<meta charset="UTF-8" />
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"></script>
<link rel="stylesheet" href="css/jquery.cxcolor.css">
<script src="js/jquery.cxcolor.min.js"></script>
<style type="text/css"> </style>
</head>
<body>
<input id="color_a" name="mycolor" type="text" class="input_cxcolor" readonly>
<script>
$('#color_a').cxColor();
</script>
</body>
</html>

  

插件使用一颜色选择器---cxColor的更多相关文章

  1. -_-#【jQuery插件】Colorpicker 颜色选择器

    Spectrum - The No Hassle jQuery Colorpicker (jQuery 插件) Color Picker jQuery plugins (jQuery 插件) colo ...

  2. 10个精选的颜色选择器Javascript脚本及其jQuery插件

     Color picker即颜色选择器使我们在web开发中可能经常用到的组件,今天我们特意精选了10个超酷的颜色选择器实现,其中包括了javascript脚本 实现及其传说中的jQuery插件实现 ...

  3. 11个JavaScript颜色选择器插件

    几年前,很难找到一个合适的颜色选择器.正好看到很多不错的JavaScript颜色选择器插件,故而把这些编译汇总.在本文,Web设计师和开发人员 Kevin Liew 选取了11个相应插件,有些会比较复 ...

  4. 基于vue的颜色选择器color-picker

    项目中有用到颜色选择器的童鞋们可以看过来了 关于color-picker的jquery的插件是有蛮多,不过vue组件没有吧,反正我没有找到, 虽然element-ui里面有这个,但是你愿意为了一个小功 ...

  5. 基于vue的颜色选择器vue-color-picker

    项目中有用到颜色选择器的童鞋们可以看过来了 关于color-picker的jquery的插件是有蛮多,不过vue组件没有吧,反正我没有找到, 虽然element-ui里面有这个,但是你愿意为了一个小功 ...

  6. c#/asp.net实现炫酷仿调色板/颜色选择器功能

    asp.net 之颜色选择器,仿调色板功能 1. 插件非常容易使用,只需引用相应的js文件和css样式文件即可,见代码示例,插件精小,炫酷 2. 只需要初始化即可使用,并且选择的颜色会在文本框中以16 ...

  7. UWP 颜色选择器(ColorPicker) 和 自定义的Flyout(AdvancedFlyout)

    ColorPicker 故事背景 项目里面需要一个像Winfrom里面那样的颜色选择器,如下图所示: 在网上看了一下.没有现成的东东可以拿来使用.大概查看了一下关于颜色的一些知识,想着没人种树,那就由 ...

  8. 改造过的JS颜色选择器

    项目中用到颜色选择功能,在网上找了个颜色选择器,自己改了改代码.做成了一个可动态加载的颜色选择器. 把代码贴上,当是记录. /*Copyright(c)2009,www.supersite.me*/ ...

  9. HTML5的input color系统颜色选择器

    前两天,我写了一篇<推荐两款jQuery色盘选择器>介绍,那是使用JavaScript实现的色盘,今天我给大家介绍HTML5的色盘选择器.HTML5有一个input类型为color,即颜色 ...

随机推荐

  1. classpath和classpath*的区别

    classpath 指的是自己项目里的编译后的class路径 classpath* 包含jar包里面的class路径

  2. 【转载】AutoML--超参数调优之Bayesian Optimization

    原文:Auto Machine Learning笔记 - Bayesian Optimization 优化器是机器学习中很重要的一个环节.当确定损失函数时,你需要一个优化器使损失函数的参数能够快速有效 ...

  3. poi读取Excel模板并修改模板内容与动态的增加行

    有时候我们可能遇到相当复杂的excel,比如表头的合并等操作,一种简单的方式就是直接代码合并(浪费时间),另一种就是写好模板,动态的向模板中增加行和修改指定单元格数据. 1.一个简单的根据模板shee ...

  4. graph slam BACK END 相关技术资料收集

    学习SLAM首推2个网站: 1. WIKI上的SLAM介绍与资源总结:http://en.wikipedia.org/wiki/Simultaneous_localization_and_mappin ...

  5. [转] netstat 查看TCP状态值

    转自 https://www.cnblogs.com/yuyutianxia/p/4970380.html netstat 查看TCP状态值   一.TCP 状态值 netstat -n | awk ...

  6. [CentOS]Failed to start OpenSSH server daemon

    问题描述: 以前一直能够通过Xshell来连接服务器,但是突然连接不上了. 解决思路: 首先通过命令查看SSH服务的状态: systemctl status sshd 可以看到,有错误,但是没有显示详 ...

  7. CentOS7开启防火墙及特定端口

    开启防火墙服务 以前为了方便,把防火墙都关闭了,因为现在项目都比较重要,害怕受到攻击,所以为了安全性,现在需要将防火墙开启,接下来介绍一下步骤. 1, 首先查看防火墙状态: firewall-cmd ...

  8. 【转】Python基础-封装与扩展、静态方法和类方法

    [转]Python基础-封装与扩展.静态方法和类方法 一.封装与扩展 封装在于明确区分内外,使得类实现者可以修改封装内的东西而不影响外部调用者的代码:而外部使用者只知道一个接口(函数),只要接口(函数 ...

  9. Python-有关文件操作,函数调用几道练习:

    1.写函数,,用户传入修改的文件名,与要修改的内容,执行函数,完成批了修改操作 2.写函数,计算传入字符串中[数字].[字母].[空格] 以及 [其他]的个数 3.写函数,判断用户传入的对象(字符串. ...

  10. mlock实现原理及应用【转】

    转自:https://blog.csdn.net/yiyeguzhou100/article/details/78085857 https://wenku.baidu.com/view/e25b4af ...