Small Customizable JavaScript Tabs Plugin – WellTabber

Category: Javascript | February 6, 2016
Views Total:1,209 views
Official Page:Go to website
Last Update:February 6, 2016


Small Customizable JavaScript Tabs Plugin – WellTabber


WellTabber is a tiny and easy to customize JavaScript plugin used for generating horizontal or vertical tabbed interface from plain Html & CSS.

How to use it:

Include the WellTabber’s JavaScript file on the webpage and we’re ready to go.

<script src="WellTabber.js"></script>

Create a basic horizontal tabbed interface.

<div class="tabsDemoBox noNavArr">
  <div class="infoNav">
    <span class="active aim" data-aimNoNavAr="tab_1">Tab 1</span>
    <span class="aim" data-aimNoNavAr="tab_2">Tab 2</span> 
    <span class="aim" data-aimNoNavAr="tab_3">Tab 3</span>
  <div class="tabsBox">
    <ul class="detailTab active" data-targetNoNavAr="tab_1">
        <h2>TAB 1</h2>
    <ul class="detailTab" data-targetNoNavAr="tab_2">
        <h2>TAB 2</h2>
    <ul class="detailTab" data-targetNoNavAr="tab_3">
        <h2>TAB 3</h2>

Initialize the WellTabber plugin.

new WellTabber("[data-aimNoNavAr]","[data-targetNoNavAr]","active");

Apply your own CSS styles to the plugin.

.tabsDemoBox {

You Might Be Interested In:

Leave a Reply