Table of Contents
Examples
Basic UsageTab Spacers
JavaScript Reference
ConstructorRequirements
Attributes
Properties
Methods
Basic Usage
Create tabs using the k-tabs
component. Add tabs using the k-tab
component and tab contents using the k-tab-content
component. Use the for
attribute on the k-tab
component to link it to the corresponding k-tab-content
component.
<k-tabs>
<k-tab for="html">HTML</k-tab>
<k-tab for="js">JavaScript</k-tab>
<k-tab-content name="html">
HTML Content
</k-tab-content>
<k-tab-content name="js">
JavaScript Content
</k-tab-content>
</k-tabs>
HTML Content
JavaScript Content
Tab Spacers
Use the k-tab-spacer
component to add a flexible space between tabs.
<k-tabs>
<k-tab for="html">HTML</k-tab>
<k-tab-spacer></k-tab-spacer>
<k-tab for="js">JavaScript</k-tab>
<k-tab-content name="html">
HTML Content
</k-tab-content>
<k-tab-content name="js">
JavaScript Content
</k-tab-content>
</k-tabs>
HTML Content
JavaScript Content
JavaScript Reference
Constructor
Extends Component
new Tabs()
Requirements
Attributes
active: string
The name of the active tab.
Methods
getTab(id): Tab
Returns the tab with the specified id.
getActiveTab(): Tab
Returns the currently active tab.
getContent(id): TabContent
Returns the tab content with the specified id.
getActiveContent(): TabContent
Returns the currently active tab content.