Zurb Foundation top bar menu on iPhone issue -
i have zurb foundation 3 navigation menu. when page on phone, correctly shows phone version of menu system.
however, way activate menu tap down=arrow triangle on right. want have title active.
edit: added this link simple working version of home page.
notice, tapping bar or word "menu" highlights bar, arrow makes menu appear.
i hiding name ("menu") on desktop , showing on phone so:
<div class="row"> <div class="contain-to-grid"> <nav class="top-bar"> <ul> <!-- title area --> <li class="name show-for-small"> <h1><a href="#">menu</a></h1> </li> <li class="toggle-topbar"><a href="#"></a></li> </ul> <section> <!-- left nav section --> <ul class="left"> etc.
since expect lot of people tap on title "menu" access menu want make same tapping arrow on right.
if adjust:
.top-bar ul > li.toggle-topbar { cursor: pointer; display: block; height: 45px; position: absolute; right: 0; top: 0; width: 50%; }
and change width value to:
width 100%;
it work - in app.css add:
.top-bar ul > li.toggle-topbar { width: 100%; }
Comments
Post a Comment