Script File

jq.buildTabbedNav.js ( view )

Available Options

tabClass

A string specifying the class name to assign to the parent UL tag of the list. Default is "tabBar".

current

An integer specifying the tab (ordered by index, base 0) of the tab to be initially set to current state. Default is null.

disabled

An array specifying the tabs (ordered by index, base 0) to be initially set to disabled state. Default is none, denoted as an empty array, [ ].

cornerBG

A string specifying the background color which the tabs overlay. Default value is "#FFF".

cornerRadius

An integer specifying the radius of the tab corners. Default value is 6.

linkAction

A string specifying the intended action of the tab links, displaying modules within the current document ("module") or referencing another page ("page", the default).

Basic Usage

$("ELEMENT").buildTabbedNav();

$("ELEMENT").buildTabbedNav({ options });

Minimum Browser Support

• Apple Safari 3
• Google Chrome 1
• Microsoft Internet Explorer 6
• Mozilla Firefox 3
• Opera 9

The main navigation (above) for this page is an example of the essential default (the only option being a change to the corner background color).

Associated Code

<script type="text/javascript">
$(document).ready(function() {
  $(".tabBar").buildTabbedNav({
    cornerBG   : "#F8F8F8"
    });
  });
</script>

This example binds modules within the page to the tabs, such that the associated module is displayed when the tab is clicked. A sample disabled tab is also shown.

• Link A
• Link B
• Link C
• Link D
• Link E

Module A

This module is associated with tab link A...

Module B

This module is associated with tab link B...

Module C

This module is associated with tab link C...

Module D

This module is associated with tab link D...

Module E

This module is associated with tab link E...

Associated Code

<script type="text/javascript">
$(document).ready(function() {
  $("#sampleNav").buildTabbedNav({
    current    :  0,
    disabled   :  [4],
    linkAction : "module"
    });
  });
</script>