foundation5 меню всегда отзывчивое

Я использую основу5 для ответов в моей теме Wordpress. Как определить в фундаменте5 меню, чтобы выглядеть отзывчивым даже в большом разрешении. В настоящее время он упал до 73.2142857143em. Я хочу, чтобы меню всегда свертывалось, даже для ширины 2000em.foundation5 меню всегда отзывчивое

Здесь мой html.

<section id="navBar"> 
<div class="contain-to-grid clearfix sticky"> 
    <nav class="top-bar" data-topbar role="navigation" data-options="sticky_on: large;"> 
     <ul class="title-area"> 
      <li class="name">logo</li> 
      <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li> 
     </ul> 
     <section class="top-bar-section"> 
      <ul id="menu-top-menu" class="top-bar-menu left"><li id="menu-item-567" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item active menu-item-567 active"><a href="http://url.loc/coming-soon/">Search</a></li> 
       <li id="menu-item-570" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-570"><a href="http://url.loc/kategorie/">Category</a></li> 
       <li id="menu-item-584" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-584"><a href="http://url.loc/faq/">Faq</a></li> 
      </ul>      </section> 
    </nav> 
</div>

Заранее спасибо за вашу помощь.

источник

2016-07-27 harry

Было бы проще помочь, если бы вы добавили css, но все, что вам нужно было бы сделать, это изменить значение медиа-запроса на ширину, в которой вы хотите, чтобы меню реагировало, или просто заменить существующее меню css на css внутри медиа-запроса, так что он всегда будет реагировать

источник

2016-07-27 22:07:20 Connor

css - это немодифицированный фундамент5 css (я не включил его как слишком большой, и это было бы не очень умно). В любом случае обе вещи, которые вы упомянули, я попробовал, но решение css не работало, оно просто адаптировало мое представление. Это означает, что добавление значка меню (gui) отображается в большом разрешении, так как я хотел, НО этот вопрос не доступен. Javascript этого элемента просто не работает (не запуская действие открытого меню). Поэтому я пришел к выводу, что это должно быть сделано по-другому, а не путем изменения css @media. – harry

Таким образом, поведение, отличное от ..., я всегда вижу значок меню, но он открывается только тогда, когда я ниже 73.2142857143em :), поэтому мне нужно сжать окно, чтобы увидеть меню :) – harry

, если кто-нибудь знает о примере в foundation5, где меню остается свернутым всегда, даже для большого разрешения, отправьте мне ссылку, я проверю его сам ... unfortunatelly i did not find any example of the type и этот тип версии фрейма, спасибо – harry

В Foundation 5.5.3 вы можете изменить ширину точки останова верхней панели, обновив foundation.css. В следующих двух местах, я меняю точку останова на 9999px (или что вы хотите):

Изменение ширины запроса СМИ:

@media only screen and (min-width: 9999px) { 
    .top-bar { 
    ...blah.blah.blah

и этот стиль

meta.foundation-mq-topbar { 
    font-family: "/only screen and (min-width:9999px)/"; 
    width: 9999px; 
}

Это должен работать, но если это не так, сообщите нам, какую версию Foundation 5 вы используете (в теме Wordpress).

источник

2016-08-10 22:34:08 asonnenshine

Ссылка на эту тему: [Изменение точки останова Topbar с использованием CSS] (http://foundation.zurb.com/forum/posts/1053-changing-topbar-breakpoint-using-css) – asonnenshine

foundation5 меню всегда отзывчивое

ответ

Смежные вопросы