Tabulous.js – A jQuery tabs module for todays web!

Tabulous.js can be used with any contents you choose in the tabs and it couldn’t be more simpler to use. It has four effects to display content – scale, slide, scale up and flip and it is very easy to implement and edit. Have a look at the demo and the instructions of how to use and you will see how beautiful these tabs are.

 

tabulous.js -  A jQuery tabs module for todays web!

DEMOS | DOWNLOAD

Getting Started

Include the relevant files

Firstly include jQuery and the tabulous.css and tabulous.js files. Place these before </head> section

<link href=’tabulous.css’ rel=’stylesheet’ type=’text/css’>

<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js”></script>

<script type=”text/javascript” src=”tabulous.js”></script>

 

Create the tabs

<div id=”tabs”>

<ul>

<li><a href=”#tabs-1″ title=””>Tab 1</a></li>

<li><a href=”#tabs-2″ title=””>Tab 2</a></li>

<li><a href=”#tabs-3″ title=””>Tab 3</a></li>

</ul>

<div id=”tabs_container”>

<div id=”tabs-1″>

<!–tab content–>

</div>

<div id=”tabs-2″>

<!–tab content–>

</div>

<div id=”tabs-3″>

<!–tab content–>

</div>

</div><!–End tabs container–>

</div><!–End tabs–>

 

Initiate the plugin

 

Once you have created your tabs you will need to initiate the plugin.

At its most basic level you can initiate the plugin like:

$(document).ready(function ($) {

$(‘#tabs’).tabulous({);

});

 

If you want to initiate the plugin with an effect then you can do so like:

 $(‘#tabs’).tabulous({

effect: ‘scale’

});

 

Options

Variable     Default Value      Description                                                                  Valid Options

Related post:  Divas Slider – A multipurpose & responsive slider solution

effect          scale               The effect to use for the transition         scale / slideLeft / scaleUp / flip

Divi WordPress Theme

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close