位置:首页 » 教程 » jQuery soColorPacker 网页拾色器

jQuery soColorPacker 网页拾色器

日期:2016-07-01 阅读:0num
Advertisement

未采用生僻的jquery特性,能兼容jquery1.2.6以上所有版本

实例预览

引入文件

<link type="text/css" rel="stylesheet" media="all" href="soColorPacker/css/style.css" />
<script type="text/javascript" src="jquery1.8.0.min.js"></script>
<script type="text/javascript" src="jquery.soColorPacker-1.0.min.js"></script>
<script type="text/javascript" src="jquery.bgiframe-2.1.1.js"></script>

使用方法

<input type="text" class="txt" id="txt_pack_1" name="txt" />
$('#txt_pack_1').soColorPacker();

soColorPacke参数

$(obj).soColorPacker({
changeTarget:null, //颜色选择后填入或改变的目标对象,默认null为当前引用方法对象
textChange:true, //是否将颜色值填入target对象
colorChange:1, //值:0,1,2 ,0:不改变,1:改变文字颜色,2:改变背景颜色
selfBgChange:false,//改变自身背景颜色
size:2, //值:1,2,3,改变拾色器表现大小,1:小,2:中,3:大
x:0,////拾色器坐标x轴偏移量
y:20, //拾色器坐标y轴偏移量
styleClass:null,//自定义添加class名,不能为默认的 "colorPackerBox"
callback:callback:function(){}//点击颜色单元返回事件
});
相关文章
  • jQuery soColorPacker 网页拾色器

    未采用生僻的jquery特性,能兼容jquery1.2.6以上所有版本 实例预览 引入文件 <link type="text/css" rel="stylesheet" media="all" href="soColorPacker/css/style.css" /> <script type="text/javascript" src="jquery1.8.0.min.js&q

  • JavaScript奇效实例012-网页拾色器

    JavaScript特效实例012-网页拾色器 实例012 网页拾色器 实例说明 在网站中经常需要用户自定义颜色来显示某些信息.这可以在网页添加一个拾色器来实现. 技术要点 在本实例中仅使用216种浏览器安全的颜色,即所谓的Netscape色块.这216种颜色分别代表0.51.102.153.204这5个颜色值以及每一种原色(即红.绿.蓝).这些十进制数值对应的十六进制数分别为0x00.0x33.0x66.0x99.0xCC和0xFF.在HTML的颜色属性中黑色是#000000,纯红色是#FF0

  • JQuery 拾色器插件发布-jquery.icolor.js JQuery 拾色器插件发布-jquery.icolor.js

    以前我一直用的那个(eyecon.ro) 功能完整也简易,但是不尽符合上面的要求,于是 google了N下,结果没找到现成的jquery拾色器插件很好的支持以下功能: 简单易用,仅显示常用的那些色块给用户选择,另外提供一个输入框方便用户输入自定义的色值 于是我写了icolor这个插件,除了支持上面的要求,还有别的一些特性如下: 1,默认提供的色值为"常用的浏览器安全的色值".相当于整合了下面最后一个prototype版本的颜色拾取器.关于浏览器安全色值,可参考维基文档http://en

  • JS实现的网页上的颜色拾色器

    使用Js代码编写一个网页上用的颜色拾色器,也就是选择颜色用的,用鼠标单击任意颜色块,将弹出颜色值,当你想使用某种颜色而不知道颜色值的时候,用这个小特效可以告诉你颜色值是多少,比较方便. 颜色拾色器 红 绿 蓝 灰 用鼠标单击下面的颜色块,将弹出颜色值 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • iOS软件iWheelColor:装在口袋里的拾色器 iOS软件iWheelColor:装在口袋里的拾色器

    颜色代码对于程序员和网页设计师来说非常重要,但如果不是在电脑旁,那么多的颜色代码一定不好记,也不容易查看效果.所以就有贴心的国外开发商推出了一款名为iWheelColor的辅助软件. iWheelColor 点击进入下载界面 iWheelColor iWheelColor是一款拾色器软件,它可以让平面设计师.程序员和网页设计师等工作者非常直观和正确的找到颜色组合.我们在软件的主界面上可 以看到一个色彩轮,可以随意用手去触摸滑动或是改变.iWheelColor既支持2种颜色的互补,也支持三个颜色的

  • 用纯js打造拾色器无法实现循环点击onclick

    用纯js制作拾色器无法实现循环点击onclick 网上是有很多拾色器代码,但是我是新手,想用纯js制作拾色器,代码如下. 问题是我如果一个一个触发onclick事件内容输出没有问题,但是假如for语句,就提示undefined <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> #container{

  • Linux下拾色器:功能强大的gpick Linux下拾色器:功能强大的gpick

    以往在 Linux 下要拾个颜色啥的我一直用 gcolor2 应付着.不过话说回来,gcolor2 的功能实在有些弱.现在有了功能更加强大的 gpick,gcolor2 可以正式"下岗"咯. 且让我们来看看 gpick 有些啥好功能: 在放大的屏幕区域中,按空格键即可快速取色: 为拾取的颜色自动命名: 能够将拾取的颜色以不同格式拷贝到剪贴板,目前包括十六进制.RGB 及 HSL: 可以将拾取的颜色导出为调色板,支持 gpl.ase.mtl 等格式,以供 GIMP.Inkscape 等程

  • HTML 拾色器

    获取 暗/明 渐变颜色效果.

  • (原创)jQuery Media Plugin-jQuery的网页媒体播放器插件的使用经验 (原创)jQuery Media Plugin-jQuery的网页媒体播放器插件的使用经验

    (原创)jQuery Media Plugin-jQuery的网页媒体播放器插件的使用心得 jQuery Media Plugin是一款基于jQuery的网页媒体播放器插件,它支持大部分的网络多媒体播放器和多媒体格式,比如:Flash, Windows Media Player, Real Player, Quicktime, MP3,Silverlight, PDF.它根据当前的脚本配置,自动将a标签替换成div,并生成object, embed甚至是iframe代码,至于生成object还是

  • jquery:使用 SoundManager 二 创建简单的网页音频播放器

    jquery:使用 SoundManager 2 创建简单的网页音频播放器 官网:http://www.schillmania.com/projects/soundmanager2/ HTML5 标准中加入了两个非常强大的标签 audio 和 video ,让我们在网页中嵌入视频和音频变得非常方便,但是不幸的是目前用户所使用的有很大一部分浏览器都是老版本的,并不支持这两个标签,这使前端开发者们很困扰,这里介绍一款相对来讲支持浏览器比较多的网页音频播放器 ------ SoundManager 2

  • 利用HTML5制作漂亮的网页音乐播放器 利用HTML5制作漂亮的网页音乐播放器

    html5的强大大家都知道了我们可以使用简单的代码实现漂亮复杂的一些功能,下面来看一个利用HTML5制作漂亮的网页音乐播放器的例子. APlayer是一个非常漂亮的HTML5音频播放器,它将audio标签封装,并结合CSS制作出漂亮的播放器UI,它支持设置歌名.歌手和歌词,可以设置是否自动播放,支持缩略图,支持播放进度以及设置播放源. HTML 首先是要加载播放器样式文件,这个播放器的样式酷似网易云音乐播放器.然后在body中加入播放器div#player1,待会要调用播放.接着载入APlaye

  • 基于讲述jQuery Ajax请求状态管理器

    基于讲述jQuery Ajax请求状态管理器是一篇对ajax深入了解的一篇文章有需要了解的朋友可以参考一下. 现在的网站,在一个网页中有异步请求甚至许多个异步请求已经不足为奇.Ajax已经成为了现在网站必须的基本功能,使网页应用更接近于桌面应用. 然而,无论有多么接近,通过客户端与服务端的一来一回,必定会有等待加载数据的时间.所以,大多数网站都通过一个Gif动态图标或'Loading...'等字样来告知用户数据还在加载中.但有时候这个问题会非常繁琐和麻烦,要么将这个'Loading'显示在aja

  • HTML5之audio实战,网页音乐播放器开发 HTML5之audio实战,网页音乐播放器开发

    今天我们就基于 HTML5 audio 来,开发一个网页音乐播放器. 在HTML5 新特性中,audio .video 是我们比较关心的 新 元素,我们终于可以脱离 Flash ,来开发音频.视频播放器了,对于 一个HTML 新元素,无非就是 属性.事件 .方法等等,关于audio 的具体的属性.事件 .方法,请谷歌. 看我们的HTML代码: audio.html Audio 正在播放: 播放 上一首 下一首 暂停 播放模式 单曲循环 顺序播放 随机播放 <script src="bowe

  • 网页安全色介绍 网页安全色介绍

    虽然现代计算机绝大部分都是支持256色(8位),但只有216种颜色是在网页上是通用的,即使在现在普遍支持到16位与32位的计算机中,还是有10%的计算机的色彩被局限在256种. 上图就是网页安全色,我们可以在大部分图像软件(如photoshop)中找到它们 上图是网页安全色其中所有的绿色,我们可以发现只有6种绿色在网页是被安全显示的. 如果我们在网页中使用一种绿色,而这种绿色并不属于上面六种绿色之中,那么就会在一些只有256色的计算机上显示成一种带有微小网格状的色彩.可以参考下图: 上图中夸大了

  • flash混色器面板教程 flash混色器面板教程

    混色器面板是Flash中用于色彩处理的一个重要面板,熟练地使用该面板,可以帮助用户快速地完成色彩的填充,编辑出色彩丰富的图形.在该面板中可以对线条和图形的颜色进行高级设置,具体分为以下几种类型. 一.无填充色 无填充色是指图形的填充区域没有颜色内容,在面板中只能设置线条的色彩.如图1所示. 图1 二.纯色填充 纯色填充是Flash 8默认的色彩填充模式,也是最常用的一种色彩填充模式,用于完成对图形色彩的填充,如图2所示. 图2 三.线性渐变填充 线性渐变填充是从图形的一边向另一边进行逐渐变化色彩

  • jQuery控制网页打印指定区域的使用方法

    本文实例讲述了jQuery控制网页打印指定区域的方法.分享给大家供大家参考.具体分析如下: 使用jQuery控制网页打印指定的区域,可以指定一个div区域的id即可实现打印网页的部分内容,如下代码所示: <html> <head> <title>jquery 打印指定区域内容</title> <script src="js/jquery-1.7.2.min.js"></script> <script type

  • Jquery实现网页跳转或用命令打开指定网页的解决方法

    本篇文章是对使用Jquery实现网页跳转或用命令打开指定网页的解决方法进行了详细的分析介绍,需要的朋友可以参考下 Jquery实现网页跳转或用命令打开指定网页!location.href = "www.jb51.net"; location.href = "aa.aspx";

  • JQuery给网页更换皮肤的方法

    本文实例讲述了JQuery给网页更换皮肤的方法.分享给大家供大家参考.具体分析如下: 为了更好的提升用户体验,很多网页都有换肤的功能,那么这是怎么实现的那,其实,换肤只不过是在对应的位置改了Css样式罢了!! 下面就演示如何简单的换肤 在设计HTmL代码时,注意一些小技巧,可以将皮肤选项按钮的id设置成和皮肤样式文件名称相同,这样皮肤切换的操作就简单多了样式连接要带一个有Id样式的连接表,通过操作该链接的href属性的值,从而实现换肤.即: 用户点击完就可以换肤了,但是,当用户刷新或者关闭浏览器

  • Dreamweaver网页安全色 Dreamweaver网页安全色

    虽然现代计算机绝大部分都是支持256色(8位),但只有216种颜色是在网页上是通用的,即使在现在普遍支持到16位与32位的计算机中,还是有10%的计算机的色彩被局限在256种. 上图就是网页安全色,我们可以在大部分图像软件(如photoshop)中找到它们 上图是网页安全色其中所有的绿色,我们可以发现只有6种绿色在网页是被安全显示的. 如果我们在网页中使用一种绿色,而这种绿色并不属于上面六种绿色之中,那么就会在一些只有256色的计算机上显示成一种带有微小网格状的色彩.可以参考下图: 上图中夸大了

  • jQuery控制网页打印指定区域的方法

    使用jQuery控制网页打印指定的区域,可以指定一个div区域的id即可实现打印网页的部分内容,如下代码所示: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 <html> <head> <title>jquery 打印指定区域内容</title> <script src="js/jquery-1.7.2.min.js&qu

最新文章
  • [南京]跪求 PHP高级研发工程师、架构师 大神们快到碗里来

    北京迈基诺基因科技有限责任公司跪求PHP大神,各位大神快到碗里来啊.来到碗里,妈妈就再也不当心我的住宿了因为公司提供住宿.团队氛围轻松,自由,自从来到这里你再也不用当心周末加班了.因为周末双休哦-! 职责描述: 1.设计和改进大规模WEB平台技术架构: 2.参与各项研发规范的制定和基础研发环境的搭建: 3.负责架构中间件及基础核心模块的设计研发和演进: 4.负责解决项目中存在的架构等技术问题: 5.对团队开发人员进行代码质量审核.技术指导和监督: 6.跟踪前沿技术,评估并引入适用的新技术: 任职

  • 才下单两天就发货了,google play够迅速的。nexus5 32G熊猫机。

    我去,下单时显示2-3周发货,这才两天就发货了.而且竟然没被砍单!太幸运了吗?购入两台,一台自用,一台可出.需要的可以提前预定.32G熊猫机. 非常感谢. 好消息!您的 Google Play 订单中的商品已发货. 重要信息:请注意,您的跟踪编号最多可能需要24小时才能激活.跟踪编号激活后,您可以在此处查看物流状态: #1Z7F382V03162*****. 订单号: 15731260465432498277.1531311044547**** 订购日期: 2013-11-20 上午07时59分

  • 明朝历史

    自明太祖朱元璋开始,明朝便竭力推行加强中央集权的方针和政策,如废除丞相.创设内阁大学士.改行省为三司.重用厂卫特务等,从而使君权达到了前所未有的高度.明前期,虽曾爆发"靖难之役",但政治上强大,并出现了郑和七下西洋的壮举."土木之变"后,国势由盛转衰,宦官长期干政.万历时,出现张居正改革.明末,内外矛盾激化,明朝被农民战争灭亡. 在前代的基础上,明朝社会经济获得极大的发展.农产品商品化扩大,手工业生产水平提高,工艺精湛,商业繁荣,市场活跃,更产生了资本主义萌芽. 在

  • 有降血脂功效的五种平民食物

    绿豆芽:将胆固醇排出去 绿豆本身就是一种很好的降胆固醇食物,而在它发芽过程中,维生素C可达到绿豆原含量的六七倍之多.大量维生素C可促进胆固醇排泄,防止其在动脉内壁沉积. 绿豆芽的膳食纤维,能帮助清除体内垃圾,还可以与食物中的胆固醇相结合,并将其转化为胆酸排出体外,从而降低胆固醇水平. 绿豆芽性味甘凉,富含水分,还可以解腻生津,是不可多得的减肥调脂小菜. 苹果:吸收多余胆固醇 苹果是人们容易忽视的"降脂果",它的降脂作用源于其中丰富的果胶,这是一种水溶性膳食纤维,能与胆汁酸结合,像海绵一

  • vivo y29定时开关机设置方法 vivo y29定时开关机设置方法

    1)打开vivo Y29[设置],找到并点击[定时任务].(如下图) 2)界点击[定时开关机],自行设置时间即可.(如下图) 注:更多精彩教程请关注本站手机教程栏目,本站手机数码群:296605639欢迎你的加入

  • 风暴英雄高爆发英雄盘点 遇到时你已经死了 风暴英雄高爆发英雄盘点 遇到时你已经死了

    风暴英雄中,存在着这样一些英雄,他们也许身板略显薄弱,但是却有着极高的爆发力,他们往往都是是劣势时力挽狂澜的英雄,也是优势时团队中的核心.让我们一起来看看这些有着高伤害.高输出的爆发性英雄. 逐日者 凯尔萨斯 "我不会因为失败而受挫,我只会愈战愈勇."这位刚刚踏入时空枢纽的王子,曾因为想拯救他的人民,而堕落成为燃烧军团的一员.在<风暴英雄>中,他将以他的高爆发输出来证明他自己.无论是主Q玩法还是主W玩法,他都可用自己的大招爆炎术,给予对手最大的伤害打击,配合其强大的AOE能

  • 杜高犬咬人怎么办 杜高犬咬人怎么办

    前段时间有杜高犬咬死人的新闻,以杜高犬的攻击力来说,咬死人是非常容易的,咬人是不好的,杜高犬咬人的后果都让主人承担了,主人也承担不起呀,下面淘狗网来告诉你杜高犬咬人应该怎么办. 如果杜高犬咬主人,首先是要及时.严厉训斥它.杜高犬咬人后可以托着它的下巴训斥,或将杂志卷成筒向地板上敲.发出响声来恐吓它,这些都是很有效的方法.主人训斥完后,狗受到惊吓会安静下来,这时就应该好好夸奖它. 如果你的杜高犬喜欢咬陌生人,可以在朋友的帮助下,消除狗对外人的恐惧心理.可以让朋友给爱犬喂食物,并要让它看见食物是从主

  • jquery 绑定多个点击事件解决办法

    jquery 绑定多个点击事件 $(".requestName").live("click",function(){ if($(this).parent().attr("multi")=="true"){//是否可以多选 $(this).addClass("select"); } else{//单选 $(this).addClass("select").siblings().remove

  • 落地敏捷典型有关问题:计划会议中的估算,你纠结吗 落地敏捷典型有关问题:计划会议中的估算,你纠结吗

    落地敏捷典型问题:计划会议中的估算,你纠结吗? 计划会议中的估算,你纠结吗? 在Scrum中的计划会议中,估算是较为让人纠结的环节.主要的问题是:1) 花费的时间长:2) 估算不准确 3) 估算是否有必要 原因是什么?我认为主要是:1) 对需求的理解不到位:2) 每一个需求严格按照planning poker的方式,对于简单的需求和强分工的任务意义不大,但是耽误了时间:3) 设计的风险没有被发现:4) 团队受到"兑现承诺"的压力,一般会"悲观估算" 如何解决这些问题

  • 75个绝佳Web设计资源 75个绝佳Web设计资源

    75个最佳Web设计资源 一组Web 设计资源大全,包括字体,css 资源,Logo 设计资源,图标,设计启发,教程,Photoshop 素材下载,以及 wordpress 资源.每个类别又包含数十套该类别下的具体资源,可能是有关Web 设计的终极资源了. 字体 - 60 套公司用设计字体 [Smashing Magazine] - 20 套免费手写字体与资源 [Fuel Your Creativity] - 50 套专业Web设计与印刷用字体 [Noupe] - 15 套漂亮的高质量免费字体

热门推荐
  • 对 moto 360 好失望 对 moto 360 好失望 "圆形的屏幕在智能手表中非常罕见,显示分辨率在小屏幕上也算够用,毕竟也不需要用手表来播放视频或者显示高精度照片.但屏幕下侧有一条黑色的区域.据摩托工作人员介绍,这是Moto 360手表的传感区域.这或许是Moto 360手表设计的唯一缺憾,建议用户选择黑色的时针界面,避免这条黑色区域过于明显." -- <Moto 360智能手表现场体验:做工精致> http://tech.sina.com.cn/it/2014-06-26/08109460368.shtml 传感区域在屏幕
  • 冬至羊肉汤做法大全 冬至羊肉汤做法大全 羊肉做法大全--教你做大厨 羊肉是全世界普遍的肉品之一.最常见的菜谱有,葱爆羊肉,孜然羊肉,羊肉泡馍,羊肉汤等做法大全.羊肉肉质与牛肉相似,但肉味较浓.羊肉较猪肉的肉质要细嫩,较猪肉和牛肉的脂肪.胆固醇含量少.羊肉的吃法很多,爆.炒.烤.烧.酱.涮等等不一而足.不过因为它有一股令人不快的膻味,而受到一部分人的冷落.建议您在烹调羊肉时,可以加入适量的料酒和生姜,这样不仅可以去膻气,还能保持羊肉原有的风味. 下一页更精彩
  • 不同接吻技巧能反映男人的情史 不同接吻技巧能反映男人的情史 本站阅读配图 1.蜻蜓点水式恋爱中他比较腼腆,总是不敢主动出击,终于又一次他鼓起勇气,闭上了双眼,接吻的时候就像触电般,立马就止住了.这样蜻蜓点水的接吻,证明他从没和女生吻过,或者接吻经验少,你可能捡到宝了! 2.疯狂激吻他把你双手抱紧,从脸颊一直到颈部,他充满了无限的激情,一刻都不停歇.这个男人绝对是情场老手 有过丰富情史的男人,深懂女人心.在你们的恋爱交往中,他会时常给你一些惊喜,制造很多的浪漫时刻,你只需尽情享受你们的浪漫爱情,而不需要像教弟弟一样教他,不会那么费劲受累. 3.额头轻碰如果
  • 乐视《全员加速中2》 用做“生态玩法”打开综艺 乐视《全员加速中2》 用做“生态玩法”打开综艺 乐视生态圈,天生的生态基因 自2012年,乐视正式进入智能电视终端.时至今日,以乐视为代表的"平台+内容+终端+应用"的垂直整合生态已比较成熟,而乐视进一步将其垂直生态模式复制到各独立的垂直行业,例如乐视体育.乐视移动等,以求生态协同,形成生态化反. 详解乐视生态圈:在平台端,乐视布局了包含以乐视云.乐视大数据平台为基础的技术平台.以乐视商城为基础的电商平台.专注O2O领域的乐视LePar平台以及乐视金融平台;在内容端,乐视布局了以花儿影视.乐视影业.乐视自制内容等的垂直生态版权内容平
  • 恐怖的不明生物:形似东京食尸鬼动物照片 恐怖的不明生物:形似东京食尸鬼动物照片 近日,一个猎人在网站上传了一张恐怖生物照片,照片中这个不明生物移动方式是用四肢进行爬行,就好像食尸鬼一样,他的眼睛发出逼人的白光,样子特别恐怖!照片发布在到了一家狩猎公司网站,一经上传,很快引起人们在网络传播而且引发了网友极大讨论. 根据猎人的说明,当时他正在密林中设下埋伏等待着猎物的出现,突然发现这个眼睛发光的不明生物出现在了他的附近.猎人用相机拍下了其正面的照片,这个生物好像也发现了异常,很快的消失在了灌木丛中. 你第一眼看到照片时,你绝对不会相信自己的眼睛,更何况是与这样的生物相遇都觉得不
  • 顶峰——3GP手机视频转换器 顶峰——3GP手机视频转换器 顶峰--3GP手机视频转换器是一款功能强,操作简易快捷的3GP视频转换软件,支持将几乎所有流行的视频格式,如RM.RMVB.VCD.MPEG.MPG.MKV.DAT.ASF.WMV.FLV.MOV等视频文件,编辑/转换为手机3GP和3G2格式,不仅可以输出高质量的电影,而且转换速度非常快,轻松地将各种视频格式转换到手机中播放,让你可以随意享受影音的乐趣. 顶峰--3GP手机视频转换器不仅可以转换视频格式,还可以对视频进行剪辑,把多个视频合并成一个文件,也可以把一个视频分成几个部分输出,还能从视频
  • 一个人的成熟 一个人的成熟 真正的成熟由两部分组成,一半是对美好的追求,一半是对残缺的接纳.当你内心可以容纳许多自己不喜欢的事物时,就叫气场. 成熟的标志之一是懂调侃,不仅调侃世界也自我调侃.我敬重这样的态度:不要固执,不要凡事刨根问底,不要得理不让人,不要企图改变他人,不要以自己认定的道德标准要求他人,学会理解最奇怪的事物,学会欣赏与自己距离最远的艺术风格.一句话,学会随便,随便才能宽容. 成熟,就是你越来越能接受现实,而不是越来越现实.如果你越来越冷漠,你以为你成长了,但其实没有.长大应该是变温柔,对全世界都温柔. 成
  • cocos2d-x在IOS7下面文字显示异常的解决办法 cocos2d-x在IOS7下面文字显示异常的解决办法 由于xcode升级到了5.0,之前在cocos2d-x2.1.3下面的项目,出现了莫名其名的错误,主要是文字显示异常,明明有文字的,但就是不显示,后来搜了下,发现是需要修改cocos2d-x底层的相关设置,如果你在运行时出现文字显示异常,并且有如下提示: CGBitmapContextCreate: unsupported parameter combination: 8 integer bits/component; 24 bits/pixel; 3-component color space