1. дома
  2. Вопрос и ответ
  3. twitter bootstrap отзывчивое меню случайно не рушится после выбора меню

twitter bootstrap отзывчивое меню случайно не рушится после выбора меню

2013-02-11 5 views
0

Я использую Twitter Bootstrap, отвечающий за мобильное приложение, созданное с помощью приложения Brightcove App Cloud. Когда меню рушится на узких устройствах, он, в конце концов, не сможет свернуть после выбора меню. Содержимое под меню изменится, но меню не рухнет. Я попытался выделить его на одну страницу HTML или позицию позиции меню, но не вижу шаблон.twitter bootstrap отзывчивое меню случайно не рушится после выбора меню

Здесь уместна код из моих файлов (которые в основном те же шесть страниц, вне некоторого конкретного CSS):

<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0" /> 
    <meta name="apple-mobile-web-app-capable" content="yes" /> 
    <meta name="apple-mobile-web-app-status-bar-style" content="black" /> 
    <meta name="bc-manifest" content="manifest.json" /> 
    <title>Zencoder</title> 
    <link rel="stylesheet" type="text/css" href="http://files.brightcove.com/proxima-nova/font-faces.css"> 
    <link href="stylesheets/brightcove-app-cloud-1.12.min.css" rel="stylesheet"/> 
    <link href="stylesheets/bootstrap.css" rel="stylesheet"> 
    <link href="stylesheets/bootstrap-responsive.css" rel="stylesheet"> 
    <link href="stylesheets/allPagesStyles.css" rel="stylesheet"> 
    <link href="stylesheets/zencoder.css" rel="stylesheet"> 
    </head> 
<body> 

<section id="pageone" class="page"> 
    <header class="header"> 
    <div class="navbar navbar-fixed-top"> 
     <div class="navbar-inner"> 
     <div class="container"> 
      <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </a> 
      <div class="nav-collapse"> 
      <ul class="nav maintop app-navigation"> 
       <li id="mainNavTargetS"><a class="ss-nav">System Status</a></li> 
       <li id="mainNavTargetBC"><a class="bc-nav">Brightcove</a></li> 
       <li id="mainNavTargetVC"><a class="vc-nav">Video Cloud</a></li> 
       <li id="mainNavTargetAC"><a class="ac-nav">App Cloud</a></li> 
       <li class="active" id="mainNavTargetZC"><a class="zc-nav">Zencoder</a></li> 
      </ul> 
      </div><!-- /.nav-collapse --> 
     </div><!-- /.container --> 
     </div><!-- /.navbar-inner --> 
    </div><!-- /.navbar --> 
    </header>

Спасибо за помощь с этим (по крайней мере, для меня) озадачивающей проблемы ,

-Matt

источник

2013-02-11 mboles57

ответ

0

Первоначально я использовал код из учебника в списке. И это была моя проблема. Обратите внимание, что в учебном руководстве кнопка отображения меню для свернутого меню выглядит следующим образом.

<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
</a>

Если вы проверить фактический Twitter Bootstrap код это выглядит следующим образом (с помощью кнопки, а не якорь)

<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    </button>

Как я первый начал на коде это не имеет никакого значения, но, как я начали менять стили. Эти проблемы исчезли, как только я сопоставил исходный код Bootstrap.

источник

2013-03-18 17:46:44 mboles57

0

Убедитесь, что у вас нет другого javascript, который ищет .collapse или любой другой javascript, вызывающий функцию коллапса.

У меня был предыдущий код, используя пользовательскую функцию коллапса, которая, как я полагаю, противоречила Bootstrap.

источник

2013-06-13 16:22:39

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

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