.uiColorpicker()
Categories: UI
.uiColorpicker( [ options ] )
Subclass: ep
Inherit: (Subclass: ep) .Widget()
Plugin: ep.ui.colorpicker
Description: Add color picker handling for each element in the set of matched elements.
-
.uiColorpicker( [ options ] )
version added: 6.12.0options A map of additional options pass to the method.
The .uiColorpicker()
method add color picker open on click for each element in the set of matched elements.
-
Apply color picker for a button.
HTML:
<button>select color</button>
Code:
ep('button') .uiColorpicker({ autoOpen: true, orientation: 'right', callback: function( color ){ $(this).css( 'background-color', color ); } });
-
Apply extended color picker for a button.
HTML:
<button>select color</button>
Code:
ep('button') .uiColorpicker({ autoOpen: true, orientation: 'right', callback: function( color ){ $(this).css( 'background-color', color ); }, extended: { userColors: { 'Color1' : '#0A528F', 'Color2' : '#EB670B', 'Color3' : '#B0BD35', 'Color4' : '#7336F0', 'Color5' : '#59506F', 'Color6' : '#D3EC5A', 'Color7' : '#6BDC5C', 'Color8' : '#1D9675', 'Color9' : '#E087C2', 'Color10': '#47B03D', 'Color11': '#8D6319', 'Color12': '#BFD33C', 'Color13': '#85EC28', 'Color14': '#5AD9E0', 'Color15': '#B27E86', 'Color16': '#420B62', 'Color17': '#F7C93F', 'Color18': '#60FBFC', 'Color19': '#85BBC6' }, userColorsSave: function( serializedColorsArray ){ // save action to store the colors }, baseColors: { 'Base1': '#12ff98', 'Base2': '#ef9372', 'Base3': '#093fec', 'Base4': '#ac2983', 'Base5': '#a57c9d' } } });
-
close
version added: 6.12.0This event is triggered when the color picker close.
-
colorApply
version added: 6.12.0This event is triggered when the selected color applies.
-
colorReset
version added: 6.12.0This event is triggered when the selected color resets.
-
colorSelect
version added: 6.12.0This event is triggered when a color selects.
-
open
version added: 6.12.0This event is triggered when the color picker opens.
-
close
-
.uiColorpicker( 'close' )
version added: 6.12.0
Close a previously opened color picker.
-
-
open
-
.uiColorpicker( 'open' )
version added: 6.12.0
Call up a previously attached color picker.
-
-
colorApply
-
.uiColorpicker( 'colorApply' )
version added: 6.12.0
Apply the selected color.
-
-
colorReset
-
.uiColorpicker( 'colorReset' )
version added: 6.12.0
Reset the selected color to the previous selected / startup color.
-
-
colorSelect
-
.uiColorpicker( 'colorSelect', [ color ] )
version added: 6.12.0color A named or hex formated color to apply.
Select an additional color or refresh the state of the selected color.
-