https://github.com/drwpow/jquery-tabinate

1kb (minified) tab plugin for jQuery
https://github.com/drwpow/jquery-tabinate

Last synced: 9 days ago
JSON representation

1kb (minified) tab plugin for jQuery

• Host: GitHub
• URL: https://github.com/drwpow/jquery-tabinate
• Owner: drwpow
• Created: 2012-08-20T19:45:56.000Z (over 12 years ago)
• Default Branch: master
• Last Pushed: 2013-04-26T19:59:10.000Z (over 11 years ago)
• Last Synced: 2024-10-15T00:31:40.346Z (2 months ago)
• Language: JavaScript
• Homepage:
• Size: 152 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
jQuery-Tabinate

===============

1kb (minified) tab plugin for jQuery

Description

-----------

This is a lightweight, bare-bones jQuery tabination plugin for when you don't need jQuery UI bloat.

**NEW** supports “Twitter-style” hashes (eg, `Div #1` OR `Div #1` will work)

There are only *3 rules* to get it working:

* Navigation and tabs must go inside a container element (this is what you initialize)

* Navigation **must** follow a `ul li a` structure (surrounding `span`s and `div`s for styling are okay)

* Tabs **must** have `tab` class (class name can be changed with the `tabClass` option; any element will work)

It uses the first `ul` it finds as the navigation. The navigation either requires an `href` anchor set to the ID of the tab, or it will correspond the

link index with the tab index (ex, the first link will open the first tab, the second link will open the second tab, etc.). In the unfortunate event an

`li` contains two links, it will use the first link as the navigation. In the catastrophic event that there are more navigation links than tabs, or

vice-versa, the universe will implode and we will all die a quick, painless depth in the unmerciful maw of compressed space-time.

Currently, this plugin supports multiple tab windows on the same page without conflict, but not tabs within tabs.

Dependencies

------------

* jQuery

Usage

-----

To initialize:

	$('#example-one').tabinate({

		activeLinkClass : 'active',

		tabClass : 'tab',

		startTab : 0

	});

This is roughly how the HTML should look:

	


	  

	    


	      
Item One

Item Two

Item Four

Item Three

No ID

	    

	  

	  


	    
Sample content one

	  

	  


	    
Sample content two

	  

	  


	    
Sample content three

	  

	  


	    
Sample content four

	  

	  


	    
Sample content with no ID

	  

	


Options

-------

* `activeLinkClass` - *[str]* CSS class hook for active tab link LIs *(default: `active`)*

* `activeTabClass` - *[str]* CSS class hook for the visible tab *(default: `active-tab`)*

* `bookmarks` - *[bool]* Set to `1` or `true` to enable bookmarks (URL hash changes on click), or `0` or `false` to disable bookmarks *(default: `true`)*

* `tabClass` - *[str]* class that determines a tab element *(default: `tab`)*

* `startTab` - *[int]* index of list item / tab to display on load (0 is first, 1 is second, etc.)

Download

--------

https://github.com/dangodev/jQuery-Tabinate/zipball/master