bigcolorpicker 颜色拾取器插件——例
参考:http://bigui4.sinaapp.com/picker/colorpicker.html
效果:

html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title>取色</title>
<script type="text/javascript" src="js/jquery.js"></script>
<link rel="stylesheet" href="http://bigui4.sinaapp.com/css/jquery.bigcolorpicker.css">
<script src="http://bigui4.sinaapp.com/js/jquery.bigcolorpicker.js"></script>
<style>
input{
background:none;
outline:none;
border:1px solid gray;
}
</style>
</head>
<body>
<div>
<input type="text" value="" id="demoText" />
<input id="bn" type="button" value="选色" />
</div>
<script type="text/javascript">
$("#bn").bigColorpicker(function(el, color) {
$('#demoText').css('background', color);
$('#demoText').val(color);
});
</script>
</body>
</html>
注意:还需将big_bgcolor.jpg复制到项目中,图片放置的目录结构参考css:
.bigpicker-bgimage{
background-image:url(../images/big_bgcolor.jpg);
}
big_bgcolor.jpg:

bigcolorpicker 颜色拾取器插件——例的更多相关文章
- 推荐一款jQuery ColorPicked 颜色拾取器插件
先看实现的效果图, 本文底部有完整demo 不想看我墨迹的可以跳过了^_^. 官网地址:http://www.eyecon.ro/colorpicker/#about 代码SVN 地址:https:/ ...
- js颜色拾取器
几年前,很难找到一个合适的颜色选择器.正好看到很多不错的JavaScript颜色选择器插件,故而把这些编译汇总.在本文,Web设计师和开发人员 Kevin Liew 选取了11个相应插件,有些会比较复 ...
- HTML5、canvas颜色拾取器
效果图: 代码: <!doctype html> <html lang="en"> <head> <meta charset=" ...
- 第四界css大会 黑魔法-css网格背景、颜色拾取器、遮罩、文字颜色渐变、标题溢出渐变等
1.css网格背景 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- NX二次开发-Block UI C++界面Object Color Picker(对象颜色拾取器)控件的获取(持续补充)
Object Color Picker(对象颜色拾取器)控件的获取 NX9+VS2012 #include <uf.h> #include <uf_obj.h> UF_init ...
- CSharpGL(34)以从零编写一个KleinBottle渲染器为例学习如何使用CSharpGL
CSharpGL(34)以从零编写一个KleinBottle渲染器为例学习如何使用CSharpGL +BIT祝威+悄悄在此留下版了个权的信息说: 开始 本文用step by step的方式,讲述如何使 ...
- docker上安装elasticsearch和ik分词器插件和header,实现分词功能
docker run -di --name=tensquare_es -p 9200: -p 9300:9300 elasticsearch:5.6.8 创建elasticsearch容器(如果版本不 ...
- jQuery多媒体播放器插件jQuery Media Plugin使用方法
jQuery Media Plugin是一款基于jQuery的网页媒体播放器插件,它支持大部分的网络多媒体播放器和多媒体格式,比如:Flash, Windows Media Player, Real ...
- Wavesurfer.js音频播放器插件的使用教程
Wavesurfer.js是一款基于HTML5 canvas和Web Audio的音频播放器插件,本文主要记录它及其视觉效果插件Regions插件的使用方法. 1.创建实例 引入插件 import W ...
随机推荐
- 开放应用模型(OAM):全球首个云原生应用标准定义与架构模型
Kubernetes 项目作为容器编排领域的事实标准, 成功推动了诸如阿里云 Kubernetes (ACK)等云原生服务的迅速增长.但同时我们也关注到,Kubernetes 的核心 API 资源比如 ...
- kafka拦截器原理|案例实操
拦截器原理 Producer拦截器(interceptor)是在Kafka 0.10版本被引入的,主要用于实现clients端的定制化控制逻辑. 对于producer而言,interceptor使得用 ...
- NX二次开发-UFUN工程图表格注释检索默认单元格首选项UF_TABNOT_ask_default_cell_prefs
NX9+VS2012 #include <uf.h> #include <uf_tabnot.h> #include <NXOpen/Part.hxx> #incl ...
- (转)mysql分区技术2
转:http://database.51cto.com/art/201002/184392.htm 非整数列分区 任何使用过分区的人应该都遇到过不少问题,特别是面对非整数列分区时,MySQL 5.1只 ...
- hdu多校第六场1008 (hdu6641)TDL 暴力
题意: 设f(n,m)为比n大的第m个和n互质的数,给定一个k=(f(n,m)-n)xor n和m,求最小的n 题解: 对于给定的m而言,一个k周围合法的n分布的很密,因此在k的邻域暴力搜索即可. # ...
- c++ 实现元组 重载cout os 输出
#include <iostream> #include <string> using namespace std; class CAnyType //: public COb ...
- mave打包spring项目成jar,启动报错:Offending resource: URL [
文章目录 错误 解决 错误 Offending resource: URL [jar:file:/Users/leesin/intellij-idea-workspace/rabbitMq_Consu ...
- licecap图片区域问题
之前一直好用的licecap最近突然没法用了,结果发现是屏幕分辨率的文本大小的问题,因为选了特大的.发现制作成的gif图片的区域有问题.后来改回中等的,就可以了.
- (十七)从UML角度来理解依赖
UML软件建模 什么是依赖?简单理解就是一个类A用到了类B,但是这种使用关系是偶然性的.临时性的.非常弱的,类B的变化会影响到类A 显示依赖与隐式依赖 依赖倒置:我们要依赖于高层业务,不依赖于低层业务 ...
- android Toast提示异常:java.lang.RuntimeException: Can't create handler inside thread that has not called
Toast只能在UI线程弹出,解决此问题可以在Toast前后加两行代码,如下所示: Looper.prepare(); Toast.makeText(getApplicationContext(),& ...