# Flache Offcanvas-Navigation in allen Viewports

**URL:** https://forum.shopware.com/t/flache-offcanvas-navigation-in-allen-viewports/39044
**Category:** Programmierung
**Created:** [14. August 2016 um 15:17 UTC](https://forum.shopware.com/t/flache-offcanvas-navigation-in-allen-viewports/39044 "2016-08-14T15:17:51Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![spy23](https://avatars.discourse-cdn.com/v4/letter/s/3be4f8/32.png) [@spy23](https://forum.shopware.com/u/spy23)
#### Post date: [14. August 2016 um 15:17 UTC](https://forum.shopware.com/t/flache-offcanvas-navigation-in-allen-viewports/39044/1 "2016-08-14T15:17:51Z")

</div>

Hallo!

Ich möchte die Offcanvas-Navigation gern in allen Viewports anzeigen. Das ist mir mithilfe des Forums bereits gelungen. Ich nutze dazu den&nbsp;window.StateManager.

```
(function($, window) {

    window.StateManager

    // OffCanvas menu auch für desktop
    .addPlugin('*[data-offcanvas="true"]', 'swOffcanvasMenu', ['xs','s','m','l','xl'])
    
})(jQuery, window);

```

Da mein Shop mit einer flachen, top-level&nbsp;Navigation auskommt,&nbsp;möchte ich zusätzlich das&nbsp;swSubCategoryNav System deaktivieren,. Dehalb habe ich die Teile der SubNavigation aus dem Template entfernt. Wenn ihr in meinem Shop guckt funktioniert das soweit ganz gut, aber nicht fehlerfrei: [www.lexibo.com](http://www.lexibo.com)

Sobald ihr in einer Kategorie oder auf einer Detailseite das Offcanvas-Menü öffnet, bekommt das DIV .sidebar-main mehrere Klassen: “is–active is–open is–inactive”.

Die Klasse&nbsp;is–inactive verhindert jetzt das scrollen innerhalb des Menüs. Das ist natürlich ein ungewünschter Effekt. Gerade bei landscape Mobilgeräten muss das Menü scrollbar sein.&nbsp;Ich denke diese Klasse wird vom Plugin&nbsp;swSubCategoryNav gesetzt. Wie kann ich das verhindern?

Ich habe folgendes ohne Erfolg getestet:

```
.addPlugin('.sidebar-main', 'swSubCategoryNav', {
    'enabled': false
}, ['xs', 's','m','l','xl'])

.removePlugin('.sidebar-main', 'swSubCategoryNav', ['xs', 's','m','l','xl'])  

```

Die Klasse&nbsp;is–inactive ist nach wie vor im DOM, wenn ich das Menü öffne.

Vielleicht hat ja jemand von euch eine schlaue Idee 🙂

Gruß aus Köln,  
Stefan