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. 8个超炫酷仿苹果应用的HTML5动画

    苹果的产品一直以精美的UI著称,无论是软件应用还是硬件设备.本文主要分享了8个很不错的HTML5动画应用,这些动画正式模仿了苹果的各类应用,有焦点图.钟表.菜单等HTML5应用和jQuery插件,大家 ...

  3. jq仿ps颜色拾取功能-js颜色拾取

    1.效果展示 2.html代码:index.html <!DOCTYPE html> <html lang="en"> <head> <m ...

  4. Android 教你打造炫酷的ViewPagerIndicator 不仅仅是高仿MIUI

    1.概述 哈,今天给大家带来一个ViewPagerIndicator的制作,相信大家在做tabIndicator的时候,大多数人都用过 TabPageIndicator,并且很多知名APP都使用过这个 ...

  5. 仿网易/QQ空间视频列表滚动连播炫酷效果

    代码地址如下:http://www.demodashi.com/demo/11201.html 一.准备工作 AndroidStudio 开发环境 需要下载七牛的开源播放器SDK 本例子实现了仿网易/ ...

  6. Android 常用炫酷控件(开源项目)git地址汇总

    第一部分 个性化控件(View) 主要介绍那些不错个性化的 View,包括 ListView.ActionBar.Menu.ViewPager.Gallery.GridView.ImageView.P ...

  7. html5跟随鼠标炫酷网站引导页动画特效

    html5跟随鼠标炫酷网站引导页动画特效一款非常不错的引导页,文字效果渐变,鼠标跟随出绚丽的条纹.html5炫酷网站引导页,鼠标跟随出特效. 体验效果:http://hovertree.com/tex ...

  8. 7款经典炫酷的HTML5/jQuery动画应用示例及源码

    jQuery是一款普遍受前端开发者欢迎的Javascript框架,但是开发者貌似更关注jQuery开发的插件,海量的jQuery插件让前端开发者非常方便.HTML5的加入让jQuery这个家族更加丰富 ...

  9. 炫酷实用的jQuery插件 涵盖菜单、按钮、图片

    新的一周开始了,今天我们要为大家分享一些全新的jQuery插件和HTML5/CSS3应用,这些jQuery插件不仅非常炫酷,而且还挺实用,这次的分享包含jQuery菜单.CSS3按钮已经多种图片特效, ...

随机推荐

  1. Linux基础-swap交换分区

    任务:对一块15G大小的硬盘进行分区,主分区为5G,扩展分区10G,一个逻辑分区5G作为swap交换分区,并激活查看新的swap分区 第一步,建立的新的SCSI硬盘,开启Linux系统前添加一块大小为 ...

  2. tomcat集群及session共享

    一般来说,java web app主要用作两个领域: 1.api.api一般是无状态的,所以无需考虑session共享的问题 2.传统web应用和网站,如crm,oa,erp,b2c,bbs等.尤其b ...

  3. Strusts2笔记5--数据验证

    数据验证: 输入验证分为客户端验证与服务器端验证.客户端验证主要通过JavaScript脚本进行,而服务器端验证主要是通过Java代码进行验证. 分为以下四种情况: (1)手工编写代码,对Action ...

  4. torch.Tensor.view (Python method, in torch.Tensor)

    返回具有相同数据但大小不同的新张量.返回的张量共享相同的数据,必须具有相同数量的元素,但可能有不同的大小. Example >>> x = torch.randn(4, 4) > ...

  5. 深拷贝数组 np.copy

    数组对象自带了浅拷贝和深拷贝的方法,但是一般用深拷贝多一些: 代码如下: >>> a = np.ones((2,2)) >>> b = a >>> ...

  6. 采用dlopen、dlsym、dlclose加载动态链接库【总结】【转】

    转自:https://www.cnblogs.com/Anker/p/3746802.html 1.前言 为了使程序方便扩展,具备通用性,可以采用插件形式.采用异步事件驱动模型,保证主程序逻辑不变,将 ...

  7. 如何开启mysql5.5的客户端服务 命令行打开方法

    MySQL分为两个部分,服务器端和客户端,只有服务器端的服务开启后,才可以通过客户端登录到MySQL数据库.这里介绍如何用命令行方式开启mysql的客户端服务. 在计算机上安装好mysql软件   我 ...

  8. 【转】http_load压力测试过程和使用方式

    介绍:http_load以并行复用的方式运行,用以测试web服务器的吞吐量与负载.但是它不同于大多数压力测试工具,它可以以一个单一的进程运行,一般不会把客户机搞死.还可以测试HTTPS类的网站请求. ...

  9. docker使用Dockerfile构建ssh容器

    一.使用Dockerfile构建centos 1.创建 Dockerfile mkdir centos # 创建一个目录存放之后的Dockerfile,目录名无所谓 cd centos # 进入目录 ...

  10. CF 983B 序列函数

    CF 983B 序列函数 一道本校神仙wucstdio出的毒瘤签到题. 题意: 给你一段序列,求出它们的最大异或和. 解法: 其实这道题并不很难,但读题上可能会有困难. 其实样例我是用Python 3 ...