Tabulous — плагин вкладок, табов

Tabulous - представляет собой плагин для реализации у себя на сайте блока с вкладками с различными эффектами переключения самих вкладок.

HTML

Разметка типичная для табов, и довольно простая.

<div id="tabs">
    <ul>
        <li><a href="#tabs-1" title="">Вкладка 1</a></li>
        <li><a href="#tabs-2" title="">Вкладка 2</a></li>
        <li><a href="#tabs-3" title="">Вкладка 3</a></li>
    </ul>
    <div id="tabs_container">
        <div id="tabs-1">
            <p>
                Третий день с неба течет вода,<br> Очень много течет воды.
            </p>
        </div>
        <div id="tabs-2">
            <p>
                Знаешь, каждую ночь<br> Я вижу во сне море.
            </p>
        </div>
        <div id="tabs-3">
            <p>
                Мы приходим домой к себе,<br> Люди ходят из дома в дом,
            </p>
        </div>
    </div>
</div>

Подключаем необходимые файлы:

<link href='tabulous.css' rel='stylesheet' type='text/css'>
<script type="text/jаvascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/jаvascript" src="tabulous.js"></script>

Инициализируем плагин:

$(document).ready(function($) {
    $('#tabs').tabulous({
        effect: 'scale'
    });
});

Доступные опции

• effect - По умолчанию scale, это эффект переключения вкладок, доступны значения: scale / slideLeft / scaleUp / flip