tab

tabcordion

A simple jQuery plugin that transforms a set of Bootstrap tabs into a Bootstrap accordion.

Showing:

Popularity

Downloads/wk

4

Maintenance

No Maintenance Data Available

Package

Dependencies

0

Size (min+gzip)

1.6KB

License

MIT

Type Definitions

Tree-Shakeable

No?

Categories

Readme

Bootstrap Tabcordion

First it's tabs, now it's an accordion - it's a TABCORDION!

A simple jQuery plugin that transforms a set of Bootstrap tabs into a Bootstrap accordion. It can be configured to perform this transformation based on the size of the container or viewport to provide responsive awesomeness to your buzzword-rich UI.

Usage

From JavaScript

$('.tabcordion').tabcordion()

Markup

<div class="tabcordion">
  <ul class="nav nav-tabs">
    <li class="active"><a data-target=".home">Home</a></li>
    <li><a data-target=".profile">Profile</a></li>
    <li><a data-target=".messages">Messages</a></li>
    <li><a data-target=".settings">Settings</a></li>
  </ul>
  <div class="tab-content">
    <div class="home active in">
      <h3>Home</h3>
      <p>Rhoncus magna nec enim, et proin aliquet mid, porta magnis.</p>
    </div>
    <div class="profile">
      <h3>Profile</h3>
      <p>Odio mattis, non ut! Porttitor nunc phasellus cras elementum.</p>
    </div>
    <div class="messages">
      <h3>Messages</h3>
      <p>Enim hac tristique elementum, nec rhoncus porttitor sagittis cum.</p>
    </div>
    <div class="settings">
      <h4>Settings</h4>
      <p>Arcu auctor, porttitor tincidunt, aliquam ut ut, placerat porta pulvinar dictumst?</p>
    </div>
  </div>
</div>

Installation

bower install tabcordion

Dependencies

Depends on the Bootstrap collapse plugin.

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100