source: extensions/pwgCumulus/js/colorpicker.instance.js

$(function() {
    $('input.pwg-picker')
      .each(function() {
          if ($(this).val() !== undefined) {
            if ($(this).val().indexOf('#',0)==-1) {
              $(this).css('background-color', '#'+$(this).val());
            } else {
              $(this).css('background-color', $(this).val());
            }
      }
        })
      .ColorPicker({
        onSubmit: function(hsb, hex, rgb, el) {
            $(el).val(hex);
            $(el).ColorPickerHide();
            $(el).css('background-color', '#'+hex);
          },
            onBeforeShow: function () {
            $(this).ColorPickerSetColor(this.value);
          }
        })
      .bind('keyup', function(){
          $(this).ColorPickerSetColor(this.value);
        });

    if ($('#pwg_cumulus_mode_transparent').is(':checked')) {
      $('#pwg_cumulus_p_bgcolor')      
        .css('opacity', '0.3')
        .children().children('input').attr('disabled', 'disabled');
    }
    $('#pwg_cumulus_mode_transparent')
      .click(function() {
          if ($(this).is(':checked')) {
            $('#pwg_cumulus_p_bgcolor')
              .animate({opacity:'-=0.7'}, 500)
              .children().children('input').attr('disabled', 'disabled');
          } else {
            $('#pwg_cumulus_p_bgcolor')
              .animate({opacity:'+=0.7'}, 500)
              .children().children('input').removeAttr('disabled');
          }
        });
  });