c#/asp.net实现炫酷仿调色板/颜色选择器功能
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实现炫酷仿调色板/颜色选择器功能的更多相关文章
- 8个超炫酷仿HTML5动画源码
1.jQuery万年历插件 带农历老皇历功能 这是一款基于jQuery的日历插件,这款日历插件和之前分享的日历控件有很大差异,它是一本万年历,包含了农历已经老皇历的功能,是一个挑好日子的工具.同时日历 ...
- 8个超炫酷仿苹果应用的HTML5动画
苹果的产品一直以精美的UI著称,无论是软件应用还是硬件设备.本文主要分享了8个很不错的HTML5动画应用,这些动画正式模仿了苹果的各类应用,有焦点图.钟表.菜单等HTML5应用和jQuery插件,大家 ...
- jq仿ps颜色拾取功能-js颜色拾取
1.效果展示 2.html代码:index.html <!DOCTYPE html> <html lang="en"> <head> <m ...
- Android 教你打造炫酷的ViewPagerIndicator 不仅仅是高仿MIUI
1.概述 哈,今天给大家带来一个ViewPagerIndicator的制作,相信大家在做tabIndicator的时候,大多数人都用过 TabPageIndicator,并且很多知名APP都使用过这个 ...
- 仿网易/QQ空间视频列表滚动连播炫酷效果
代码地址如下:http://www.demodashi.com/demo/11201.html 一.准备工作 AndroidStudio 开发环境 需要下载七牛的开源播放器SDK 本例子实现了仿网易/ ...
- Android 常用炫酷控件(开源项目)git地址汇总
第一部分 个性化控件(View) 主要介绍那些不错个性化的 View,包括 ListView.ActionBar.Menu.ViewPager.Gallery.GridView.ImageView.P ...
- html5跟随鼠标炫酷网站引导页动画特效
html5跟随鼠标炫酷网站引导页动画特效一款非常不错的引导页,文字效果渐变,鼠标跟随出绚丽的条纹.html5炫酷网站引导页,鼠标跟随出特效. 体验效果:http://hovertree.com/tex ...
- 7款经典炫酷的HTML5/jQuery动画应用示例及源码
jQuery是一款普遍受前端开发者欢迎的Javascript框架,但是开发者貌似更关注jQuery开发的插件,海量的jQuery插件让前端开发者非常方便.HTML5的加入让jQuery这个家族更加丰富 ...
- 炫酷实用的jQuery插件 涵盖菜单、按钮、图片
新的一周开始了,今天我们要为大家分享一些全新的jQuery插件和HTML5/CSS3应用,这些jQuery插件不仅非常炫酷,而且还挺实用,这次的分享包含jQuery菜单.CSS3按钮已经多种图片特效, ...
随机推荐
- Android 动态添加Spinner(.java文件内实现) 实现 改变spinner 内文字属性
动态添加spinner 控件 Spinner s = new Spinner(this); String []items={"自己定义的要显示的数组"}; my_SpinnerAd ...
- C. Polygon for the Angle(几何)
题目链接:http://codeforces.com/contest/1096/problem/C 题目大意:T是测试样例,然后每一次输入一个角度,然后问你在一个n边形里面,能不能构成这个角度,如果能 ...
- 信息安全学习笔记--XSS
一.XSS简介 XSS (Cross Site Scripting)是一种经常出现在web应用中的计算机安全漏洞,它允许恶意web用户将代码植入到提供给其它用户使用的页面中.比如这些代码包括HTML代 ...
- UNIX环境高级编程 第10章 信号
SIGSTOP和SIGKILL区别是:前者是使进程暂时停止,即中止,也就是说使进程暂停,将进程挂起,比如你在终端里面执行一个脚本或者程序,执行到一半,你想暂停一下,你按下ctrl+z,就会导致终端发送 ...
- ORB_SLAM2 源码阅读 ORB_SLAM2::Initializer::ComputeF21 (OpenCV 细节)
ORB_SLAM2 计算 F21 的代码是这样的. cv::Mat Initializer::ComputeF21(const vector<cv::Point2f> &vP1,c ...
- 查看oracle数据库日志存放位置
1,默认情况下,oracle的日志文件记录在$ORACLE/rdbms/log目录下 [oracle@oracle log]$ pwd /home/oracle/oracle/product/11.2 ...
- JS判断是否是PC端访问网站
function IsPC() { var userAgentInfo = navigator.userAgent; var Agents = ["Android", " ...
- 使用PyMongo访问需要认证的MongoDB
Windows 10家庭中文版,Python 3.6.4,PyMongo 3.7.0,MongoDB 3.6.3,Scrapy 1.5.0, 前言 在Python中,使用PyMongo访问Mongod ...
- mybatis 控制台打印sql脚本
在mybatis-config.xml文件中加一句 <setting name="logImpl" value="STDOUT_LOGGING" /> ...
- python基础-类的其他方法
一.isinstance(obj,cls)检查是否obj是类的cls对象 # -*- coding:utf-8 -*- __author__ = 'shisanjun' class Foo(objec ...