单击关闭JQuery水平手风琴

Question

示例： http ： //vincent-massaro.com/map/

当前，该脚本允许您单击手风琴的一部分以将其打开，但是设置为在mouseleave上关闭。 当我将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

您可以设置一个布尔变量来表示手风琴是否打开，然后单击即可检查。 （您也需要在点击时切换变量的状态）

编辑：

好的，尝试一下。 像这样设置一个布尔全局变量（在click事件之外）：

var accordion_expanded = false;

然后在您的click事件中执行以下操作：（我尚未对此进行测试，因此您可能需要对其进行一些调整以适合您的情况）

在扩展手风琴的功能中输入以下内容：

accordion_expanded = true;

在签约手风琴的功能中，

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

   accordion_expanded == false;
}

祝好运！

Answer 2

试试这个

$('.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');
});