直接上代码:
Ext.onReady( function() {
var colorShowId = '';
var colorWin = new Ext.Window( {
border :0,
frame:false,
closeAction :'hide',
closable :false,
resizable :false,
width :100,
height :80,
items : [
{
xtype:'colorpicker',
listeners: {
select: function(picker, selColor) {
var color = '#' + selColor;
// alert(colorShowId+','+color);
Ext.getDom(colorShowId).style.background = color;
colorWin.hide();
}
}
}
]
}) ;
function showColor(id) {
colorShowId = id;
var colorText = Ext.getCmp(id);
colorWin.x = colorText.getPosition()[0] + colorText.getWidth();
colorWin.y = colorText.getPosition()[1];
colorWin.show();
}
var form = Ext.create('Ext.form.Panel',{
width:200,
buttons: [{
text: '',
id:'bb',
style:'background:red',
handler: function(btn) {
showColor('bb');
}
} ],
renderTo:Ext.getBody()
});
})
一:定义form,form里面有个button,button的click方法显示颜色选择器
二:颜色选择器放在window里
三:选择颜色后改变button的背景色
分享到:
相关推荐
extjs下的颜色选择器,很好用,可以试试,应该能满足大多数需要
Extjs颜色选择器,完整实例,直接打开ColorField.html文件就可以看到实例效果。不需要引用其他文件。
采用Ext技术实现的一款超漂亮的颜色选择控件,可以任意选择颜色,并且自动改变文本框的背景颜色。
ExtJS6.0版本的颜色选择器控件,modern版颜色控件,2.0
6.1 ext js的选择器:ext.domquery / 215 6.1.1 选择器的作用 / 215 6.1.2 使用ext.query选择页面元素 / 215 6.1.3 基本选择符 / 223 6.1.4 属性选择符 / 229 6.1.5 css属性值选择符 / 234 6.1.6 伪类选择符 ...
这个文件是重写ext的ColorPickerFieldPlus控件,实现自定义调色,和ps取颜色一样,比Ext自带的颜色多很多,是自己可以调的
7.2.7 在线编辑器Ext.form.HtmlEditor 7.3 ExtJS表单组件的综合应用 第8章 设计表格类布局 8.1 表格简介 8.1.1 表格的基本属性 8.1.2 制作第一个表格 8.2 表格常用功能详解 8.2.1 主要属性功能 8.2.2 自定义...
关于selector选择器,相信当家都不陌生,textColor、background等等都可以设置选择器。 前几天把最近新加的功能跑到公司的测试机上发现,纷纷崩溃!心里仿佛一万只什么马奔腾而过,在我自己手机(Android Q)上一点...
传入一个CSS选择符的参数,然后依据该CSS选择符从当前元素下面,形成期待匹配子节点的集合,也就是“选择”的操作,最后以一个Ext.CompositeElement类型的组合元素的形式返回。如果以Ext.select()调用表示从document...
7.2.7 在线编辑器Ext.form.HtmlEditor 7.3 ExtJS表单组件的综合应用 第8章 设计表格类布局 8.1 表格简介 8.1.1 表格的基本属性 8.1.2 制作第一个表格 8.2 表格常用功能详解 8.2.1 主要属性功能 8.2.2 自定义...
1.4.2 在项目中使用EXT 3 1.5 为什么页面提示"找不到图片" 3 1.6 辅助开发 4 1.6.1 调试工具Firebug 4 1.6.2 开发利器Spket 7 1.7 本章小结 10 第2章 EXT框架基础 11 2.1 EXT的事件和类 11 2.1.1 自定义...
如果您没有选择的插件管理器,我建议您使用 : Plug ' arzg/vim-rust-syntax-ext ' 当现有的Rust语法突出显示足够好时,为什么还要使用此插件? 这是使用官方插件rust.vim的一些代码的屏幕截图: 这是使用vim-...
在https://github.com/GovernorFancyPants/traviz-chrome-ext上提供或留下建议版本历史记录:0.5.0-选择器搜索,组合输入字段,近似搜索,打开或关闭随机颜色0.4.1-错误修复0.4。 0-已实现对任何属性和值0.1.1的搜索...
Emmet支持有助于将缩写快速扩展为CSS代码(https://docs.emmet.io/css-abbreviations/)*颜色选择器(支持HEX,RGB, RGBA,HSL和HSLA)*将代码从Less / Sass转换为CSS *美化/格式化代码*缩小代码*突出显示与CSS选择...
阿瓦奇 您的空中文章翻译器 使用频率字典仅翻译具有一定复杂度的单词 关于阿瓦克 离线工作 频率字典 ... 除了所有这些,翻译的单词都可以通过单击发音,并且颜色设置将使您能够选择最适合眼睛的颜色。
简单的android颜色选择器与色轮和亮度栏。 示范影片 屏幕截图 WHEEL_TYPE.FLOWER WHEEL_TYPE.CIRCLE 如何添加依赖关系? 该库未在Maven Central中发布,但是您可以使用 在allprojects.repositories添加远程Maven ...
【提示】颜色可以随便写一个“#000”形式的属性值,再通过点击左边显示行号旁边的颜色显示方块,弹出来颜色选择器对颜色进行选择。当设置的颜色为系统提供的Color资源内的颜色时,如“@color/colorAccent”,将不能...
287 如何使用AFX EXT CLASS导出类? 288 如何使用declspec(dllexport)导出DLL函数? 第15章 程序版权信息 289 如何查询程序说明? 290 如何查询程序开发商? 291 如何查询程序内部名称? 292 如何查询程序产品名称? 293 ...