JQuery активировать одну вкладку с несколькими ссылками - установка активного класса на обе одновременно

Question

Как гласит заголовок, я хочу создать интерфейс вкладок, в котором у меня есть несколько ссылок, которые управляют одной и той же панелью вкладок.

Надеюсь, вы поймете, что я имею в виду, когда посмотрите на пример: http://jsfiddle.net/kimatg/EtVZW/2/

Здесь все работает просто отлично, и все ссылки работают хорошо, но одна проблема состоит в том, что «активный» класс (в данном случае .current) будет работать только в одном контейнере-вкладке за один раз....

Другими словами, у меня есть 2 меню с вкладками (.map и .tabnav) в демоверсии;когда я нажимаю Region 2 в div.tabnav, соответствующий тег a получает класс .current, а соответствующий тег a в div.map не делает.

Какможно ли сделать так, чтобы оба div-а получали классы .current одновременно, а не когда выбрана другая вкладка?

Да, и, кстати, я использовал jQuery Tools в примере, но хорошо, если есть необходимость реализоватьЭто другой способ, как jQuery UI.

Answer 1

Я не знаком с jQuery Tools, поэтому я использовал UI.

Вот скрипка: http://jsfiddle.net/jomanlk/XwpDK/4/

В основном я использовал индекс, чтобы выделить нужную ссылку

var $tabs = $('#tabs').tabs({
    select : function(event, ui) {
        var selected = $tabs.tabs('option', 'selected'); 
        $('a').removeClass('highlight');
        $('a').eq(ui.index).addClass('highlight');
    }
});

$('.map a:first').addClass('highlight');
$('.map a').click(function(){
    $tabs.tabs( "select" , $(this).index());
});