By default, the direction of a C1TabStrip control is horizontal (top), but you can easily change the direction of a C1TabStrip control to right, left, or bottom by setting the Direction property. The following instructions will explain how to change the orientation of your tabstrip in Design view, in Source view, and in code.
In Design View
Complete the following steps:
1. Click
C1TabStrip's smart tag (
) to open the C1TabStrip Tasks menu and then select TabStrip
Designer.
The C1TabStrip Designer Form appears.
2. Select C1TabStrip from the treeview to reveal its list of properties.
3. Locate the Direction property and select an item from its drop-down list. For this example, we are going to choose Left.
4. Click OK and observe that the C1TabStrip is now vertical and appears at the left.
In Source View
In Source view, add Orientation="Vertical" to the <cc1:C1TabStrip> tag so that your HTML resembles the following:
<cc1:C1TabStrip ID="C1TabStrip1" runat="server" Direction="Left" OverlapOrder="Ascending"
VisualStyle="Vista" VisualStylePath="~/C1WebControls/VisualStyles" Width="150px">
In Code
Complete the following steps:
1. Import the following namespace into your project:
Imports C1.Web.UI.Controls
• C#
using C1.Web.UI.Controls;
2. Add the following code to the Page_Load event:
C1TabStrip1.Direction = TabDirection.Left
• C#
C1TabStrip1.Direction = TabDirection.Left;
3. Run the program.
This topic illustrates
the following:
A C1TabStrip controlcan be switched to a vertical orientation by setting the Direction property to Left. The following image depicts a C1TabStrip control with a Left orientation:
|
