1、在页面引入colpick,js文件
2、初始方法
$("seletor").colpick();
3、常见的属性及方法使用
flat(是否在页面展示取色面板):默认为false,true为展示 layout(颜色表示方法 例如HSB,lab,RGB,CMYK与十六进制表示法):rgbhex,hex.....
submit(是否显示提交按钮) 在onChange事件调用中默认为true,在onSubmit 事件中默认为false :true||false
color(面板初始时的颜色):颜色值
onChange(取色改变时发生的事件):function(hsb,hex,rgb,el,bySetColor){ $(el).css('border-color','#'+hex); //el执行该事件的对象
if(!bySetColor) $(el).val(hex); //bySetColor是否确认改变了颜色
}
onSubmit (确认时调用的事件): function(hsb, hex, rgb, el){
}
onBeforeShow(显示之前触发的事件)
onShow(显示时触发的事件)
onHide(隐藏时触发的事件)
//对象的方法 colpickHide()---面板隐藏 colpickShow()----面板显示 $('#pickpic').colpick({ colorScheme: 'light', layout: 'rgbhex', color: '1080C8', onSubmit: function(hsb, hex, rgb, el) { $(el).css('background-color', '#' + hex); $(el).colpickHide(); } });