Создание JQuery горизонтальной гармошкой на клик

Question

Пример: http://vincent -massaro.com / map /

В настоящее время скрипт позволяет щелкнуть по фрагменту аккордеона, чтобы открыть его, но для него установлено значениезакрыть на отпуске мыши.Когда я устанавливаю mouseleave на .click, он запутывается и не знает, в каком состоянии он находится. Я хочу сделать так, чтобы вы могли щелкнуть, чтобы открыть его, и щелкнуть, чтобы закрыть его, вместо mouseleave.Код, управляющий этим, приведен ниже, а полный скрипт находится в haccordion.js, связанном с источником страницы.Если бы кто-то мог помочь мне изменить этот скрипт, я был бы очень благодарен!Заранее спасибо.

$target.click(function(){
            haccordion.expandli(config.accordionid, this)
                    config.$lastexpanded=$(this)
  })
            if (config.collapsecurrent){ //if previous content should be contracted when expanding current
                    $target.mouseleave(function(){
                          $(this).stop().animate({width:config.paneldimensions.peekw}, config.speed)
  })
  }

Answer 1

попробуйте использовать это

$('.accordion-item-header').click(function() {
    var item = $(this).parent().find('.accordion-item-body');
    item.toggleClass('open').animate({
        width:item.hasClass('open') ? 0: 100 
    }, 100).toggleClass('open');
});

Answer 2

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

Редактировать:

Хорошо, попробуйте это.Установите булеву глобальную переменную (вне события click) следующим образом:

var accordion_expanded = false;

Затем в вашем событии click сделайте что-то вроде этого: (Я не проверял это, поэтому вам, возможно, придется немного помассировать, чтобыв соответствии с вашими обстоятельствами)

В функции, где вы расширяете свой аккордеон, поместите это:

accordion_expanded = true;

И в функцию, где вы заключаете свой аккордеон, выполните

if(accordion_expanded == true){
   //Contract accordion code goes here

   accordion_expanded == false;
}

Удачи!