JQuery переключает несколько Div, включая один, а остальные отключить

Question

Привет, я пытаюсь придумать, как использовать виджет аккордеона (который я сейчас использую, h3 - триггер), что при выборе h3 появляется другой div, а затем при выборе другого h3,появляется новый div, а другой исчезает и т. д.

, поэтому у меня есть макет из трех столбцов, левый столбец - мой виджет аккордеона, при выборе h3 появится средний div (анимация не имеет значения)и плавающий правый столбец внутри этого блока, чтобы создать вид трехколоночного макета, который будет использоваться для отображения / скрытия содержимого в этом среднем блоке.Со мной все еще ????

Имейте в виду, что первый h3 открыт по умолчанию, поэтому будет также открыт соответствующий средний столбец и плавающий правый столбец внутри, но он исчезнет, ​​когда другой h3 будетвыбранный и т. д.

Мой jquery / javascript в лучшем случае минимален, и я не могу придумать какое-либо направление, чтобы пойти с этим.

Использую ли я переключатель?показать спрятать?Любые идеи будут высоко оценены!

Так что я думаю, что я пытаюсь сделать так, чтобы содержимое заполнялось ссылками внутри div'ов для показа / скрытия, переключения или чего-то еще, когда пользователь нажимает нассылка, а не отображение списка элементов / содержимого.

Answer 1

Исходя из того, что вы описали, я кодировал небольшой пример. Пожалуйста, посмотрите на это для начала и прокомментируйте любые ваши вопросы. Надеюсь, что это хорошая отправная точка для вас.

Просмотр исходного кода для точного кода.

http://jsbin.com/ixaco

Answer 2

Спасибо ТБ, это именно то, что я искал. С кодом, который вы дали, сможете ли вы сказать, возможно ли добавить эффекты Jquery Ui в заполненные элементы div из show / hide? Думал о как слепой эффект или что-то. Было любопытно, так как я уже использую виджет аккордеона в качестве левой колонки. Пусть кто-нибудь задается вопросом, почему я звоню в библиотеку пользовательского интерфейса для начала.

Ваш код:

$(function(){
  $("h3").click(function(){
    $(".content").hide();
    $(this).next().show();
  });
  $("h3:first").click();
});

#

Если я добавлю «слепой»:

   $(".content").hide(blind);
    $(this).next().show(blind);

Что-то в этом роде, я полагаю ... в основном, чтобы немного придумать это

Еще раз спасибо.