# Accordion Menü erweitern

**URL:** https://forum.shopware.com/t/accordion-menu-erweitern/17584
**Category:** Shopware 3.5
**Tags:** programming
**Created:** [5. Januar 2014 um 17:03 UTC](https://forum.shopware.com/t/accordion-menu-erweitern/17584 "2014-01-05T17:03:03Z")
**Posts on this page:** 2
**Page:** 1

<div class="post-metadata">

### Author: ![ErikBrinx](https://avatars.discourse-cdn.com/v4/letter/e/b5ac83/32.png) [@ErikBrinx](https://forum.shopware.com/u/ErikBrinx)
#### Post date: [5. Januar 2014 um 17:03 UTC](https://forum.shopware.com/t/accordion-menu-erweitern/17584/1 "2014-01-05T17:03:03Z")

</div>

Hallo zusammen, ich hatte mir damals dieses Accordion Plugin installiert und es läuft auch sehr gut [http://forum.shopware.de/templates-und-design-f14/accordion-menu-in-shopseite-einbinden-t5262-10.html?hilit=accordion#p28786](http://forum.shopware.de/templates-und-design-f14/accordion-menu-in-shopseite-einbinden-t5262-10.html?hilit=accordion#p28786) Jetzt wollte ich die Funktion ein wenig erweitern, habe aber keinen Plan, wie ich das anstellen könnte. Habe von Javascript nicht wirklich die Ahnung. Im Normalfall wird der toggle\_container geschlossen, wenn ich auf den aktiven Trigger klicke oder einen anderen Trigger aktiv setze. Dies möchte ich auch beibehalten. Jedoch möchte ich auch, dass der Container sich schließt, wenn ich irgendwo auf die Seite klicke, so wie es im Backend bei den Menüs der Fall ist. Wie kann ich das lösen. Hier nochmal der Code dazu: `{block name="frontend\_index\_header\_javascript\_inline" append} $(document).ready( function() { $('.toggle\_container').hide(); $('.trigger').click( function() { var trig = $(this); if ( trig.hasClass('trigger\_active') ) { trig.next('.toggle\_container').slideToggle('fast'); trig.removeClass('trigger\_active'); } else { $('.trigger\_active').next('.toggle\_container').slideToggle('fast'); $('.trigger\_active').removeClass('trigger\_active'); trig.next('.toggle\_container').slideToggle('fast'); trig.addClass('trigger\_active'); }; return false; }); }); {/block}` Grüße Erik

---

<div class="post-metadata">

### Author: ![Martin\_Schindler](https://avatars.discourse-cdn.com/v4/letter/m/22d042/32.png) [@Martin\_Schindler](https://forum.shopware.com/u/Martin_Schindler)
#### Post date: [5. Januar 2014 um 17:22 UTC](https://forum.shopware.com/t/accordion-menu-erweitern/17584/2 "2014-01-05T17:22:07Z")

</div>

Versuchs mal folgendermaßen: ` {block name="frontend\_index\_header\_javascript\_inline" append} $(document).ready( function() { var mouse\_is\_inside = false; $('.toggle\_container').hide(); $('.trigger').click( function() { var trig = $(this); if ( trig.hasClass('trigger\_active') ) { trig.next('.toggle\_container').slideToggle('fast'); trig.removeClass('trigger\_active'); } else { $('.trigger\_active').next('.toggle\_container').slideToggle('fast'); $('.trigger\_active').removeClass('trigger\_active'); trig.next('.toggle\_container').slideToggle('fast'); trig.addClass('trigger\_active'); }; return false; }); $('.toggle\_container').hover(function(){ mouse\_is\_inside=true; }, function(){ mouse\_is\_inside=false; }); $("body").mouseup(function(){ if(! mouse\_is\_inside) $('.toggle\_container').hide(); }); }); {/block} ` Hoffe das hilft, konnte es aktuell nicht ausprobieren.
