Повторное срабатывание каллбака метода hide()

[project1]

Написал простенький плагин вкладок. Вопрос снизу в комментарии при вызове плагина.

<div class="tab-section">
    <div class="tabs">
        <a href="0" class="tab tab-current">Самовывоз в Москве</a>
        <a href="1" class="tab">Доставка по Москве</a>
        <a href="2" class="tab">Доставка в регион России</a>
    </div>
    <div class="tab-content">
        Контент Самовывоз в Москве
    </div>
    <div class="tab-content">
        Контент Доставка по Москве
    </div>
    <div class="tab-content tab-section">
        Контент Доставка в регион России
        <div class="tabs">
            <a href="2" class="tab tab-current">Почтой России</a>
            <a href="4" class="tab">Транспортной компанией "Деловые линии"</a>
        </div>
        <div class="tab-content tab-section">
            Почтой России
            <div class="tabs">
                <a href="2" class="tab tab-current">Обычная</a>
                <a href="3" class="tab">Срочная</a>
            </div>
            <div class="tab-content">
                Контент Почтой России Обычная
            </div>
            <div class="tab-content">
                Почтой России Срочная
            </div>
        </div>
        <div class="tab-content tab-section">
            Транспортной компанией "Деловые линии"
            <div class="tabs">
                <a href="4" class="tab tab-current">До терминала</a>
                <a href="5" class="tab">До адреса</a>
            </div>
            <div class="tab-content">
                Транспортной компанией "Деловые линии" До терминала
            </div>
            <div class="tab-section">
                Транспортной компанией "Деловые линии" До адреса
            </div>
        </div>
    </div>
</div>

$.fn.tabs = function (callback, duration) {
    this.find('> .tabs > .tab').on('click', function(event) {
        var tab = $(this);
        var content = tab.addClass('tab-current')
            .siblings('.tab')
            .removeClass('tab-current')
            .closest('.tab-section')
            .find('> .tab-content')
            .eq(tab.index());

        content.show(duration || 0, function() {
            content.siblings('.tab-content').hide(duration || 0, function() {
                if (typeof callback === 'function') {
                    return callback.apply(tab, [content, event]);
                }
            });
        });

        return false;
    });

    var current = window.location.hash;
    var index = 0;

    return this.each(function() {
        if (current) {
            index = $('> .tabs > .tab[href="' + current + '"]', this).index();
        } else {
            index = $('> .tabs > .tab-current', this).index();
        }
        $('> .tabs > .tab', this).eq(index < 0 ? 0 : index).click();
    });
};

$('.tab-section').tabs(function() {
    if (this.is(':visible')) {
        alert(this.text()); //Если кликать по корневым вкладкам (Самовывоз в Москве, Доставка по Москве и Доставка в регион России), то каллбак срабатывает 2 раза, а по всем остальным, которые лежат внутри этих - 1 раз...
    }
});

[рони]

project1,
callback срабатывает для каждого элемента анимации, а не для всех !!!

[project1]

А как сделать, чтобы 1 раз сработал? Мне нужно чтобы каллбак вкладки сработал 1 раз и только после окончания анимации.

[project1]

Добавил проверку внутри каллбака hide()

if ($(this).is(':last-of-type')) {
    //типа если анимация последней вкладки завершилась и больше не будет вызываться hide(), только в таком случае при нажатии на последнюю вкладку каждый группы, каллбак вообще не срабатывает ((
}

[рони]

project1,
либо условие когда очередь анимаций закончится либо тоже самое но через promise -- оба варианта тут
Почему callback у animate запускается 2 раза?

[project1]

Спасибо, помогло