#Tabber javascript kit license#

I'm looking for a way to dictate which tabs sit on which row so I can have two rows of tabs with an equal number on each row. Refer to example2.html for a more complete example. On some pages the tabs don't properly fit into one row and either one or two will be forced onto a second row, or one may be split between the rows. To prevent tabber from running, before you include tabber.js, set the tabberOptions variable like this: When you load tabber.js it sets up an event to run when the page finishes loading. The tabs are numbered starting at zero, so use 0 for the first tab, 1 Refer to example2.html to see it in action.įirst you must give an id to your main tabber div.Ī tabber object is attached to the div and you can use the tabShow()ĭocument.getElementById('mytab1').tabber.tabShow(0) To select a different initial tab, use the tabbertabdefault class (in addition to the tabbertab class):

#Tabber javascript kit license#

MIT license so you can modify and use in commercial projects.īy default the first tab will be selected.Object-oriented, extensively-commented code.Use a cookie to remember which tab was selected so it remains selected when you return to the page.Define onLoad and onClick callback functions to perform more advanced functions, such as loading the tab content dynamically using AJAX.It is also necessary to include the following CSS on MediaWiki:Wikia.css / MediaWiki:Common. There is a brief introduction to Lua templating here. Use javascript to control which tab is displayed. The Devmodule template can be used to invoke modules from the Dev Wiki repository without installation.Multiple tab sets on a page - you can even nest one tab set within another.Gracefully supports printing (try a print preview on the example.html page) and allows a different set of styles to be applied when printing.Gracefully degrades if JavaScript is not present and allows a different set of styles to be applied when JavaScript is not present.Use CSS to customize the appearance of the tabs.

Plug and play: no need to know JavaScript, just make a few simple changes to your HTML.

Does not require you to set up a list of links, or anchors for the tabs.

Converts your HTML into a dynamic tabbed interface. Tabber is a jQuery plugin to create a responsive tabs/tabbed interface that will be converted into a mobile-friendly list when the window's size has reached the breakpoint.