# Box Slide

**URL:** <https://forum.shopware.com/t/box-slide/5644>\
**Category:** Shopware 3.5\
**Tags:** templates--design\
**Created:** [3. Januar 2012 um 20:34 UTC](https://forum.shopware.com/t/box-slide/5644 "2012-01-03T20:34:35Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![baschti](https://avatars.discourse-cdn.com/v4/letter/b/77aa72/32.png) [@baschti](https://forum.shopware.com/u/baschti)\
**Post date:** [3. Januar 2012 um 20:34 UTC](https://forum.shopware.com/t/box-slide/5644/1 "2012-01-03T20:34:35Z")

</div>

Hallo ihr Liebe! Ich würde gerne eine Box mit einem Klick expandieren lassen und auch per Klick zusammenfahren! Ist diese Funktion (Ähnlich wie von Filter) dafür zu gebrauchen? Für einen kleinen Tritt in die richtige Richtung wäre ich dankbar!

---

<div class="post-metadata">

**Author:** ![Stephan\_Pohl](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/stephan_pohl/32/10212_2.png) [@Stephan\_Pohl](https://forum.shopware.com/u/Stephan_Pohl)\
**Post date:** [4. Januar 2012 um 09:10 UTC](https://forum.shopware.com/t/box-slide/5644/2 "2012-01-04T09:10:57Z")

</div>

Hey baschti, du kannst dafür jQuery verwenden. jQuery bietet dir die Funktion slideToggle(), welche genau das Verhalten wiederspiegelt. [http://api.jquery.com/slideToggle/](http://api.jquery.com/slideToggle/) `$('.some-selector').click(function(event) { event.preventDefault(); $(this).slideToggle(); })` Viele Grüße, Stephan Pohl :shopware:

---

<div class="post-metadata">

**Author:** ![baschti](https://avatars.discourse-cdn.com/v4/letter/b/77aa72/32.png) [@baschti](https://forum.shopware.com/u/baschti)\
**Post date:** [4. Januar 2012 um 15:22 UTC](https://forum.shopware.com/t/box-slide/5644/3 "2012-01-04T15:22:13Z")

</div>

Vielen Dank Stephan! Ich bin leider kein richtiger Programmierer! Kannst du mir n kurzes Beispiel geben wie der Code integriert wird? Bestandteil der jquery ist er ja schon!

---

<div class="post-metadata">

**Author:** ![baschti](https://avatars.discourse-cdn.com/v4/letter/b/77aa72/32.png) [@baschti](https://forum.shopware.com/u/baschti)\
**Post date:** [4. Januar 2012 um 17:53 UTC](https://forum.shopware.com/t/box-slide/5644/4 "2012-01-04T17:53:54Z")

</div>

kriege ich damit ein und ausgeblendet! Bei ganzen div-Tags klappt es nicht!

---

<div class="post-metadata">

**Author:** ![waldicom](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/waldicom/32/12881_2.png) [@waldicom](https://forum.shopware.com/u/waldicom)\
**Post date:** [6. Januar 2012 um 22:55 UTC](https://forum.shopware.com/t/box-slide/5644/5 "2012-01-06T22:55:07Z")

</div>

[quote=„baschti“]

kriege ich damit ein und ausgeblendet! Bei ganzen div-Tags klappt es nicht![/quote] Eine doofe Frage: Du verwendest doch einen richtigen [Selector](http://api.jquery.com/category/selectors/), oder? Id, Klasse oder Name des Elementen? Wie sieht das DIV-Element aus?

---

<div class="post-metadata">

**Author:** ![baschti](https://avatars.discourse-cdn.com/v4/letter/b/77aa72/32.png) [@baschti](https://forum.shopware.com/u/baschti)\
**Post date:** [7. Januar 2012 um 00:20 UTC](https://forum.shopware.com/t/box-slide/5644/6 "2012-01-07T00:20:41Z")

</div>

Nein, keine doofe Frage! Aber ich hab’s Kraft meiner Wassersuppe hinbekommen! Aber mal ne andere Frage! Gibt es die Möglichkeit die Filter global zurückzusetzen. Also nicht jeden Filter der gewählt wurde einzeln, sondern alle mit einem Klick! Ich fin dafür keine Variable!

---

<div class="post-metadata">

**Author:** ![kaffeeteam](https://avatars.discourse-cdn.com/v4/letter/k/74df32/32.png) [@kaffeeteam](https://forum.shopware.com/u/kaffeeteam)\
**Post date:** [7. Januar 2012 um 00:36 UTC](https://forum.shopware.com/t/box-slide/5644/7 "2012-01-07T00:36:22Z")

</div>

[quote=“baschti”]Nein, keine doofe Frage! Aber ich hab’s Kraft meiner Wassersuppe hinbekommen![/quote] Stell deine Lösung doch bitte mal vor - interessiert mich 😉

---

<div class="post-metadata">

**Author:** ![baschti](https://avatars.discourse-cdn.com/v4/letter/b/77aa72/32.png) [@baschti](https://forum.shopware.com/u/baschti)\
**Post date:** [7. Januar 2012 um 00:48 UTC](https://forum.shopware.com/t/box-slide/5644/8 "2012-01-07T00:48:53Z")

</div>

Das funktioniert soweit! Die Erkenntnis war aber das sich sildetoggle dafür nicht eignet, da nach der Auswahl der Eigenschaft ein Reload stattfindet und somit wieder der status Display:None hergestellt wird! Daher hab ich den Teil wieder ausgebaut! Hängt jetzt dafür an der Rücksetzung des Filters! Achso, ich hab dropdowns gewählt! [code] {\* Filter properites \*} {block name=“frontend\_listing\_filter\_properties”} {if $sPropertiesOptionsOnly|@count}

Filtern nach Eigenschaften

{if $sPropertiesGrouped|@count \> 1 && $sCategoryContent.showfiltergroups} {foreach from=$sPropertiesGrouped item=sPropertyGroup key=name} {\* sSnippet: show all \*}{$sConfig.sSnippets.sCategoryFilterTo} {$name}: {if $activeFilterGroup == $name} {foreach from=$sPropertiesOptionsOnly item=value key=option} {if $value|@count && value.properties.group == \_GET.sFilterGroup} **{$option}** {if !$value.properties.active} {$sConfig.sSnippets.sArticlepleaseselect} {/if} {foreach from=$value.values item=optionValue} {if $optionValue.active} \<option selected\>{if $optionValue.valueTranslation}{$optionValue.valueTranslation}{else}{$optionValue.value}{/if} ({$optionValue.count})\</option\> {else} \<option value="{$optionValue.link|rewrite}" title="{$sCategoryInfo.name}"\>{if $optionValue.valueTranslation}{$optionValue.valueTranslation}{else}{$optionValue.value}{/if} ({$optionValue.count})\</option\> {/if} {/foreach} \</select\> {/if} {/foreach} {/if} {/foreach} {else} {foreach from=$sPropertiesOptionsOnly item=value key=option} {if $value|@count} {$option}   
{if !$value.properties.active}  
{$sConfig.sSnippets.sArticlepleaseselect}  
{/if}  
{foreach from=$value.values item=optionValue}  
{if $optionValue.active}  
{if $optionValue.valueTranslation}{$optionValue.valueTranslation}{else}{$optionValue.value}{/if} ({$optionValue.count})  
{else}  
{if $optionValue.valueTranslation}{$optionValue.valueTranslation}{else}{$optionValue.value}{/if} ({$optionValue.count})  
{/if}  
{/foreach}  
  
{/if} {/foreach} Filter zur¸cksetzen {/if}

{/if} {/block}

[/code]