Skip to content

sixfootsixdesigns/jQuery-Tabs

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 

Repository files navigation

jQuery Tabs

A jQuery Tab Plugin that works with Twitter Bootstrap and adds addition functionality.

Bootstrap is not rquired. You just need the markup as shown in the example.html file.

##Options

Option Type Default Data Attribute Description
initialOpenNum integer 0 data-initial-open-num The tab that should open first. Uses a zero based array as a data attribute `data-initial-open-num="2"`.
initialOpenHref string null data-initial-open-href The href of the tab to open. So if your tab is `href="#tab-3"` you can set the data attribute `data-initial-open-href="#tab-3"` to have that one open.
tabContentId string null data-tab-content-id If your tab content is not contained within the tab wrapper div you can specify this to tell it what tab content to use. `data-tab-body-id="#my-body"`.
activeTabPaneClass string active data-active-tab-pane-class The class added to the tab pane showing that it is active.
activeTabLiClass string active data-active-tab-li-class The class name added to the active tab's li showing that it is active.
tabContentClass string tab-content data-tab-content-class The class name of the tab content container.
tabPaneClass string tab-pane data-tab-pane-class The class name for each pane in the tab content.
stopClass string dont-stop data-stop-class The class name for a tab that you want to open as a link instead of a tab

##Callbacks

name Description Example
beforeOpenCallback The callback that fires before a tab is opened.
$('#selector').jqueryTabs({
	beforeOpenCallback: function(li, pane, obj) {
}

});

openCallback The callback that fires after a tab is openend.

$('#selector').jqueryTabs({
	openCallback: function(li, pane, obj) {

	}
});
		</td>
	</tr>
</tbody>

##Methods

Method Description Example
openTab Opens a tab by position (zero based array) $('#selector').jqueryTabs('openTab', 1);
openByHref Opens a tab by href $('#selector').jqueryTabs('openByHref', '#tab-2');
destroy Destroys all events $('#selector').jqueryTabs('destroy');
widget Returns the current plugin instance $('#selector').jqueryTabs('widget');
option Gets/Sets options $('#selector').jqueryTabs('option', 'stopClass'); // returns `dont-stop`
			<code>$('#selector').jqueryTabs('option', 'stopClass', 'foo'); // sets the stopClass option to `foo`</code>
		</td>
	</tr>
</tbody>

About

JavaScript with a lot more options and callbacks for Bootstrap 3

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors