Very usefull script when your tabs do not fit in a single row. This script takes the not fitting tabs and makes a new dropdown tab. In the dropdown there are all the tabs that do not fit.
Basic exemple. Resize the window to see how the tabs are moved into the dropdown
I'm in Section 1.
Howdy, I'm in Section 2.
Howdy, I'm in Section 3.
Howdy, I'm in Section 4.
Howdy, I'm in Section 5.
Howdy, I'm in Section 6.
Howdy, I'm in Section 7.
Howdy, I'm in Section 8.
Howdy, I'm in Section 9.
With tabs on the bottom and custom text for the dropdown tab.
I'm in Section 1.
Howdy, I'm in Section 2.
Howdy, I'm in Section 3.
Howdy, I'm in Section 4.
Howdy, I'm in Section 5.
Howdy, I'm in Section 6.
Howdy, I'm in Section 7.
Howdy, I'm in Section 8.
Howdy, I'm in Section 9.
With pills.
I'm in Section 1.
Howdy, I'm in Section 2.
Howdy, I'm in Section 3.
Howdy, I'm in Section 4.
Howdy, I'm in Section 5.
Howdy, I'm in Section 6.
Howdy, I'm in Section 7.
Howdy, I'm in Section 8.
Howdy, I'm in Section 9.
Call the tab drop via javascript on .nav-tabs and .nav-pills:
$('.nav-pills, .nav-tabs').tabdrop()
| Name | type | default | description |
|---|---|---|---|
| text | string | '<i class="icon-align-justify"></i>' |
the text for the dropdown tab |
Nothing special. It uses the format from tabs and pills.
Initializes an tab drop.
Checks if the tabs fit in one single row.
Hosted by MediaSecure