颜色选择器-ColorPicker

例子

平面模式

ColorPicker.init($('#colorPickerHolder'), {
  flat: true
})
      

自定义皮肤，并使用平面模式显示在一个自定义的颜色选择器部件。.

附加到一个文本字段，并使用回调函数来更新字段的值的颜色，并提交颜色设置在该领域的值。

ColorPicker.init($('#colorpickerField'), {
  onSubmit: function(hsb, hex, rgb, el) {
    $(el).val(hex)
    $(el).ColorPickerHide()
  },
  onBeforeShow: function() {
    ColorPicker.setColor($(this), this.value)
  }
})
.bind('keyup', function() {
  ColorPicker.setColor($(this), this.value)
})

使用回调的实现预览的颜色和添加颜色动画。

ColorPicker.init($('#colorSelector'), {
  color: '#0000ff',
  onShow: function(colpkr) {
    $(colpkr).fadeIn(500)
    return false
  },
  onHide: function(colpkr) {
    $(colpkr).fadeOut(500)
    return false
  },
  onChange: function(hsb, hex, rgb) {
    $('#colorSelector div').css('backgroundColor', '#' + hex)
  }
})