Objectives:
Adding and configuring Horizontal WebSplitter with interactive styles between two cells of row.
- Drag and drop the WebSplitter from the toolbox control onto the cell between two cells of row you want to split.
- Open the Property box window to configure the WebSplitter styles in SplitterStyle property. (shown in the image below)
SplitterStyle is a DynamicStyle property.
DynamicStyle is built around the WebStyle object, and consists of 3 states of interactivity: Normal, Over and Active.
- Normal.
The default style of the WebSplitter.
- Over.
The style of the WebSplitter being hovered.
- Active.
The style when the WebSplitter is in the state of being dragged.
Each of the states in DynamicStyle is WebStyle object, as you can see in the below image there are some properties you can adjust. Following is a brief descriptions of commonly used properties:
- BackColor : set the color of the WebSplitter.
- BackColor2 : set the alternate color of the WebSplitter for gradient color, relates to GradientType property.
- Cursor : the type of mouse pointer when the WebSplitter being hovered.
- Overflow, OverflowX and OverflowY should be set to hidden for consistent layout especially not in IE browser.
