asp.net 之颜色选择器，仿调色板功能

1. 插件非常容易使用，只需引用相应的js文件和css样式文件即可，见代码示例，插件精小，炫酷

2. 只需要初始化即可使用，并且选择的颜色会在文本框中以16进制的形式显示出来，即HEX颜色格式，到时候直接取值即可

3.大多数的颜色控件可能不好收集或者不易使用，故分享出来并且整理出来

4.代码展示

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

 <html>

 <head>

  <title>Farbtastic</title>

 <script type="text/javascript" src="jquery-1.9.1.min.js"></script>

 <script type="text/javascript" src="farbtastic.js"></script>

  <link rel="stylesheet" href="farbtastic.css" type="text/css" />

 <script type="text/javascript" charset="utf-8">

     //初始化

   $(document).ready(function() {

     $('#picker').farbtastic('#color');

   });

  </script>

 </head>

 <body>

 <h1>jQuery 颜色选择器</h1>

 <form action="" style="width: 300px;">

   <div class="form-item"><label for="color">Color:</label><input type="text" id="color" name="color" value="#123456" /></div>

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

 </form>

 <p>More info<a href="http://www.cnblogs.com/rushme/">rush_me</a>.</p>

 </body>

 </html>

5. 关于使用

$('#picker').farbtastic('#color'); 意思是在id为picker的容器，该容器显示颜色选择器插件，就是类似于一张很炫图片，其中id为color是将颜色显示在这个容器里面，大家可以自定义
初始化时需要自己指定对应的容器id和插线显示id

6.图片效果展示




7，关于与插件的js和css，请下载demo


												


											
c#/asp.net实现炫酷仿调色板/颜色选择器功能的更多相关文章
	

    
								
  1. 8个超炫酷仿HTML5动画源码
		
    1.jQuery万年历插件 带农历老皇历功能 这是一款基于jQuery的日历插件,这款日历插件和之前分享的日历控件有很大差异,它是一本万年历,包含了农历已经老皇历的功能,是一个挑好日子的工具.同时日历 ...
    
		
    2. 
						
  2. 8个超炫酷仿苹果应用的HTML5动画
		
    苹果的产品一直以精美的UI著称,无论是软件应用还是硬件设备.本文主要分享了8个很不错的HTML5动画应用,这些动画正式模仿了苹果的各类应用,有焦点图.钟表.菜单等HTML5应用和jQuery插件,大家 ...
    
		
    3. 
						
  3. jq仿ps颜色拾取功能-js颜色拾取
		
    1.效果展示 2.html代码:index.html <!DOCTYPE html> <html lang="en"> <head> <m ...
    
		
    4. 
						
  4. Android 教你打造炫酷的ViewPagerIndicator 不仅仅是高仿MIUI
		
    1.概述 哈,今天给大家带来一个ViewPagerIndicator的制作,相信大家在做tabIndicator的时候,大多数人都用过 TabPageIndicator,并且很多知名APP都使用过这个 ...
    
		
    5. 
						
  5. 仿网易/QQ空间视频列表滚动连播炫酷效果
		
    代码地址如下:http://www.demodashi.com/demo/11201.html 一.准备工作 AndroidStudio 开发环境 需要下载七牛的开源播放器SDK 本例子实现了仿网易/ ...
    
		
    6. 
						
  6. Android 常用炫酷控件（开源项目）git地址汇总
		
    第一部分 个性化控件(View) 主要介绍那些不错个性化的 View,包括 ListView.ActionBar.Menu.ViewPager.Gallery.GridView.ImageView.P ...
    
		
    7. 
						
  7. html5跟随鼠标炫酷网站引导页动画特效
		
    html5跟随鼠标炫酷网站引导页动画特效一款非常不错的引导页,文字效果渐变,鼠标跟随出绚丽的条纹.html5炫酷网站引导页,鼠标跟随出特效. 体验效果:http://hovertree.com/tex ...
    
		
    8. 
						
  8. 7款经典炫酷的HTML5/jQuery动画应用示例及源码
		
    jQuery是一款普遍受前端开发者欢迎的Javascript框架,但是开发者貌似更关注jQuery开发的插件,海量的jQuery插件让前端开发者非常方便.HTML5的加入让jQuery这个家族更加丰富 ...
    
		
    9. 
						
  9. 炫酷实用的jQuery插件 涵盖菜单、按钮、图片
		
    新的一周开始了,今天我们要为大家分享一些全新的jQuery插件和HTML5/CSS3应用,这些jQuery插件不仅非常炫酷,而且还挺实用,这次的分享包含jQuery菜单.CSS3按钮已经多种图片特效, ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 数据库（八）之T-SQL编程
			
    什么是Transact-SQL? 结构化查询语言(SQL)是有美国国家标准协会(ANSI)和国际标准化组织(ISO)定义的标准,而Transact-SQL是Microsoft公司对此标准的一个实现.  ...
    
			
    2. 
						
  2. 说说C语言运算符的“优先级”与“结合性”
			
    论坛和博客上常常看到关于C语言中运算符的迷惑,甚至是错误的解读.这样的迷惑或解读大都发生在表达式中存在着较为复杂的副作用时.但从本质上看,仍然是概念理解上的偏差.本文试图通过对三个典型表达式的分析,集 ...
    
			
    3. 
						
  3. springquartz的LocalDataSourceJobStore
			
    spring 为quartz 提供了一个 继承 JobStoreCMT的 LocalDataSourceJobStore,主要是为了和spring更好的集成. public class LocalDa ...
    
			
    4. 
						
  4. Python解决八皇后问题的代码【解读】
			
    八皇后问题 来自于西方象棋(现在叫 国际象棋,英文chess),详情可见百度百科. 在西方象棋中,有一种叫做皇后的棋子,在棋盘上,如果双方的皇后在同一行.同一列或同一斜线上,就会互相攻击. 八皇后问题 ...
    
			
    5. 
						
  5. docker使用Dockerfile构建ssh容器
			
    一.使用Dockerfile构建centos 1.创建 Dockerfile mkdir centos # 创建一个目录存放之后的Dockerfile,目录名无所谓 cd centos # 进入目录  ...
    
			
    6. 
						
  6. 简单ORACLE分区表、分区索引
			
    前一段听说CSDN.COM里面很多好东西,同事建议看看合适自己也可以写一写,呵呵,今天第一次开通博客,随便写点东西,就以第一印象分区表简单写第一个吧. ORACLE对于分区表方式其实就是将表分段存储, ...
    
			
    7. 
						
  7. 微信 JS API 支付教程
			
    最近一个项目中用到了微信开发,之前没有做过支付相关的东西,算是拿这个来练练手,刚开始接触支付时候很懵逼,加上微信支付开发文档本来就讲得不清楚,我是彻底蒙圈了,参考了很多代码之后,算是有一点思路了. 用 ...
    
			
    8. 
						
  8. github后端开发面试题大集合(一)
			
    作者:小海胆链接:https://www.nowcoder.com/discuss/3614?type=0&order=0&pos=5&page=0?from=wb来源:牛客网 ...
    
			
    9. 
						
  9. Ubuntu 登陆循环启动 无法进入桌面 libGL error: failed to load driver: swrast
			
    导致无法进入Ubuntu图形界面的原因很多,关键是要找到问题原因所在. 最佳的方法是查看.xsession-errors这个日志文件,依据问题解决~ 这里先汇总一下问题: 1 环境变量导致的,进入tt ...
    
			
    10. 
						
  10. centos 6.x 部署uwsgi+flask项目
			
    一.项目背景 1. 公司需求要做一个在线统计页面; 2. 统计在线人数,进行人数数据展示; 3. 类似QQ官网在线人数 二.测试环境 [root@linux-node2 ~]# cat /etc/*r ...
    
			
    11.