Wie konfiguriert man reagierende Menüs von Foundation 6, um zwischen Drilldown- und Dropdown-Typen zu wechseln? - zurb-foundation, zurb-foundation-6

Wie konfiguriere ich die reaktionsfähigen Menüs von Foundation 6, um von einem Dropdown-Menü zu einem Drilldown-Menü zu wechseln, wenn es sich beim mobilen Gerät um einen Brealpoint handelt?

Das letzte Beispiel in der Gründungsdokumentation funktioniert wie erwartet in mittleren oder größeren Ansichten, zeigt aber immer noch das horizontale Menü in kleinen Ansichten !!

Wie kann ich das Menü so verhalten, wie es das alte Menü von Foundation 5 getan hat?

Dieses Markup funktioniert fast, der Drilldown funktioniert ein wenig, aber die Menüpunkte sind immer noch horizontal ausgerichtet.

<div class="title-bar" data-responsive-toggle="example-menu" data-hide-for="medium">
<button class="menu-icon" type="button" data-toggle></button>
<div class="title-bar-title">Menu</div>
</div>

<div class="top-bar" id="example-menu">
<div class="top-bar-left">
<ul class="dropdown menu"  data-responsive-menu="drilldown medium-dropdown" >
<li class="menu-text">Site Title</li>
<li>
<a href="#">One</a>
<ul class="menu vertical">
<li><a href="#">One</a></li>
<li><a href="#">Two</a></li>
<li><a href="#">Three</a></li>
</ul>
</li>
<li><a href="#">Two</a></li>
<li><a href="#">Three</a></li>
</ul>
</div>
<div class="top-bar-right">
<ul class="menu">
<li><input type="search" placeholder="Search"></li>
<li><button type="button" class="button">Search</button></li>
</ul>
</div>
</div>

Antworten:

1 für die Antwort № 1

Loswerden dropdown Klasse von der <ul> und füge die Klassen hinzu vertical und medium-horizontal zu der Liste so sieht es so aus:

<ul class="vertical medium-horizontal menu" data-responsive-menu="drilldown medium-dropdown">

Aktualisieren: Das Fehler Im Zusammenhang mit den Dropdown-Pfeilen und Untermenü Ausklapprichtung im Responsive-Menü wurden in der Veröffentlichung von behoben foundation-sites 6.2.0.

Verwandte SO Frage: Grundlage 6 Daten-responsive-Menü-Parameter


Am beliebtesten