The Panel control is a container that can hold any controls and provides a common style for the group of controls.
Like almost all SPARK controls, you can trigger events that are fired when the user interacts with the control (see the Event and Methods sections below and the Event Handling article for more information).
This section is most commonly used to organize other controls that reside inside of it.
Appearance
Icon* Allows you to type an icon by name from Font Awesome
Color Style
Light Color Sets the fill color to a lighter shade, and changes title text to color selected in color style
Full Body Color Fills the body with color when selected, instead of just the header
Width in px, %, em; For example: 50px, 20%, 0.4em. If no unit is specified, px is assumed
Body Height Height in px, %, em; For example: 50px, 20%, 0.4em. If no unit is specified, px is assumed
* You can use icons for the labels. There are a variety of icons offered at Font Awesome
Example
These are the configuration option settings...
This is the result...
Footer
Footer Text Allows you to input a footer into the panel. Just type in what you want the footer to read in the text box.
Example
These are the configuration option settings...
This is the result...
Events
With the Panel section, there are 2 types of event handlers:
- On Load When the page loads
- On Icon Click When the Panel Icon is Clicked
You can use JavaScript logic to affect the effects of the control, depending on the event. More information on using these controls can be found in the Event Handling article.
Methods
For detailed information on the available methods for this control, access the JS Doc file.
Related Article(s)
- Author: Dan Abresch
- Date Created: June 8, 2015
- Date Modified: July 27, 2015
Comments