rocket-tab v2.0.4
Rocket Tab
A Javascript tabulation module.
Getting Started
Install via NPM.
npm install rocket-tabNOTE that this module has a dependency Rocket Tools (21kb) which will automatically be installed as well.
Start by including the necessary files.
<head>
<link href="node_modules/rocket-tab/css/tab.min.css" rel="stylesheet" type="text/css">
</head>
<body>
/* Your content goes here */
<script src="node_modules/rocket-tools/js/tools.min.js"></script>
<script src="node_modules/rocket-tab/js/tab.min.js"></script>
</body>HTML Example
The tab module uses a basic HTML structure to achieve the desired effect. See an example below.
<ul class="rocket-tab">
<li><a href="#tab-info">Info</a></li>
<li><a href="#tab-comments">Comments</a></li>
<li><a href="#tab-security">Security</a></li>
</ul>
<div id="tab-info">Info Tab</div>
<div id="tab-comments">Comments Tab</div>
<div id="tab-security">Security Tab</div>Initialization
Use the following example to trigger the tab module.
Rocket.tab();Options
| Name | Default | Options | Description |
|---|---|---|---|
target | .rocket-tab a | Set the target triggers elements. | |
animate | false | false true | Animate the transition from one tab content to the next. |
style | line | flat line none raised | Set some basic styling. |
vertical | false | false true | Set a vertical class with some basic styling. |
Rocket.tab({
target: '.link-trigger',
animate: true,
style: 'flat',
vertical: true
});Defaults
You can also overwrite the module options globally by altering the defaults. To do so reference the defaults object property. For example:
Rocket.defaults.tab.style = 'raised';Author
Created and maintained by Chris Humboldt Website: chrishumboldt.com Twitter: twitter.com/chrishumboldt GitHub github.com/chrishumboldt
Copyright and License
Copyright 2017 Rocket Project
Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.