Implementing a HSVA Palette Modal is a very similar process. selected is used to set the default color that is selected when the Color Picker is first created. controls can be used to hide or show a set of text boxes to specify the color in Hex, RGB or HSVA values by default they are shown. New Y.HSVAPalette().render( '#myHsvaPalette') įor both of these, there are two additional options possible, controls and selected. New Y.HSVPalette().render( '#myHsvPalette') Load the base submodule (the specific one would also work), create a new instance of the HSV or HSVA Palette, and render it. To use the HSV or HSVA Palette, create an HTML element to house the Color Picker. It is also possible to load the base of the Color Picker instead of the specific submodule. For example, this Color Palette will display two options: black and white. In a Color Palette, you are also able to specify the exact colors to display using the items parameter. New Y.ColorPalette().render( '#m圜olorPalette') This will give you a default palette with 10 options. Load the correct submodule ( aui-color-palette in this case), create a new instance of the Color Palette, and render it. To use the aui-color-palette, create an HTML element to house the Color Picker.
These submodules are created a bit differently.
There are some other options that you can pass to your Color Picker instance, such as the other submodules.
Now, create a new instance of the Color Picker Popover component, define your trigger, and render it. YUI().use(Ĭreate an element to trigger a Color Picker Popover. Let's start with the popover version here. There are several options available, including aui-color-palette, aui-color-picker-popover, aui-hsv-palette, aui-hsva-palette, and aui-hsva-palette-modal. Then initialize AlloyUI and load the Color Picker submodule you want. Create a dynamic color picker that allows users to select a specific color in many ways including a popover menu, inline values or a palette.įirst load the seed and CSS files, if you haven't yet.
0 kommentar(er)
