cxColor 是一款颜色选择器。这样的插件使用场景不多。可喜的这是国人写的。
官方网站: https://github.com/ciaoca/cxColor
使用方法:
1、引入jquery库
|
1
|
|
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>