Aiuto nella programmazione, risposte alle domande / Mobile / Il menu Mobile non sta collassando in Foundation 5: mobile, menu, zurb-foundation, zurb-foundation-5

Il menu Mobile non sta collassando in Foundation 5: mobile, menu, zurb-foundation, zurb-foundation-5

Pls può aiutare con questo. Guarda il sito Web su cui sto lavorando sul telefono, ho osservato che il menu è visualizzato senza fare clic sull'icona del menu e che copre il mio contenuto.Cosa posso fare per risolvere questo.Qui è il mio codice.Io sto lavorando con la fondazione 5

    <!-- tab bar navigation -->
<nav class="tab-bar hide-for-medium-up">
<section class="left-small">
<a class="left-off-canvas-toggle menu-icon"><span></span></a>
</section>
</nav>
<aside class="left-off-canvas-menu">
<ul class="off-canvas-list">
<li><a href="index.php">Home</a></li>
<li><a href="about.php">About</a></li>
<li><a href="store.php">Store</a></li>
<li><a href="clients.php">Our Clients</a></li>
<li><a href="contact.php">Contact</a></li>
</ul>
</aside>
<a class="exit-off-canvas"></a>

Grazie

risposte:

0 per risposta № 1

Ecco la tua risposta ....

   <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.2/css/foundation.css">
<div class="large-12 columns">
<nav class="top-bar" data-topbar="" role="navigation">
<ul class="title-area">
<li class="name">
<h1><a href="#">My Site</a></h1>
</li>
<li class="toggle-topbar menu-icon"><a href=""><span>Menu</span></a></li>
</ul>
<section class="top-bar-section">
<!-- Right Nav Section -->
<ul class="right show-for-large-up">
<li class="active"><a href="#">Right Button Active</a></li>
<li class="has-dropdown not-click">
<a href="#">Right Button Dropdown</a>
<ul class="dropdown"><li class="title back js-generated"><h5><a href="javascript:void(0)">Back</a></h5></li><li class="parent-link hide-for-medium-up"><a class="parent-link js-generated" href="#">Right Button Dropdown</a></li>
<li><a href="#">First link in dropdown</a></li>
<li class="active"><a href="#">Active link in dropdown</a></li>
</ul>
</li>
</ul>
<ul class="right hide-for-large-up">
<li class="active"><a href="#">Right Button</a></li>
<li class="has-dropdown not-click">
<a href="#">Right Dropdown</a>
<ul class="dropdown"><li class="title back js-generated"><h5><a href="javascript:void(0)">Back</a></h5></li><li class="parent-link hide-for-medium-up"><a class="parent-link js-generated" href="#">Right Dropdown</a></li>
<li><a href="#">First link in dropdown</a></li>
<li class="active"><a href="#">Active link in dropdown</a></li>
</ul>
</li>
</ul>
<!-- Left Nav Section -->
<ul class="left show-for-large-up">
<li><a href="#">Left Button</a></li>
</ul>
</section></nav>
</div>