Bootstrap導航摺疊一次切換

我在我正在開發的網站上有一個可摺疊菜單，但摺疊只能切換一次。我點擊「MENU」菜單展開，再次點擊它，菜單關閉，但不會繼續切換。Bootstrap導航摺疊一次切換

這是我的開發服務器的鏈接。只需調整瀏覽器窗口的大小，直到出現「MENU」按鈕並單擊它。

http://www.corporateprdev.com/ymcakpt

這裏是我的菜單結構：

<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"> 
     MENU 
     </a> 
     <a class="brand" href="/ymcakpt/"><img src="/ymcakpt/themes/responsive/images/y-nav-collapse.png" alt="YMCA::Home" longdesc="images/y-nav-collapse.png" align="left" style="margin-right: 15px;"></a> 
     <div class="nav-collapse"> 
     <ul class="nav"> 
      <li class="active"> 
      <a href="/ymcakpt/">Home</a> 
      </li> 
      <li> 
      <a href="/ymcakpt/index.php/about/" >About</a> 
      </li> 
      <li> 
      <a href="/ymcakpt/index.php/membership/" >Membership</a> 
      </li> 
      <li> 
      <a href="/ymcakpt/index.php/schedules/" >Schedules</a> 
      </li> 
      <li> 
      <a href="/ymcakpt/index.php/contact-us/" >Contact Us</a> 
      </li> 
     </ul> 
     <form class="navbar-search pull-right" action="/ymcakpt/index.php/search/"> 
      <input name="query" type="text" class="search-query" placeholder="Search" style="padding: 2px 8px; margin: 0; width: 210px;"> 
      <input name="Submit" class="submit" type="image" src="/ymcakpt/themes/responsive/images/go-btn.png" value="Go" style="width: 35px; height: 25px;"> 
    </form> 
      </div><!--/.nav-collapse --> 
     </div> 
     </div>

來源

2012-08-14 Anthony Duncan

你的情況的問題是兩個JavaScript文件，即引導-transition.js和ccm.app.js之間的碰撞。他們都在寫入jQuery變量$.support.transition。 Bootstrap要求該對象包含屬性end，該屬性包含在CSS3轉換結束時觸發的瀏覽器特定事件。另一個文件覆蓋support.transition只是一個布爾值。

當hide方法被調用，transitioning設置爲true因爲這標誌着過渡期結束時的名稱是不確定的，在transitioning財產永遠不會被重置爲false。這會導致Collapse插件上的show或hide將來的任何調用都會短路。

您可以嘗試修改ccm.app.js以與Twitter Bootstrap的Transitions插件兼容。只需添加一個不覆蓋現有值的檢查就足夠了。

另一種選擇是努力確保引導-transition.js之後ccm.app.js加載。只要ccm.app.js只是尋找truthy值，你應該很好。

來源

2012-08-14 20:30:56 merv

我想通了。似乎我有人把我的collapse.js文件與我正在處理的其他網站中的一個文件相關聯。重新加載我的原始文件，現在所有功能都正常。 – 2012-08-14 20:55:33

@AnthonyDuncan - 您剛剛將文件從2.0.4恢復爲2.0.1，並且我確定的問題仍然存在。您沒有看到相同行爲的唯一原因是因爲2.0.1中的** bootstrap-collapse.js **沒有短路功能。但是，由於問題仍然存在，因此'顯示'和'隱藏'事件將無法在頁面上觸發。我強烈建議您使用最新版本的Bootstrap並正確解決您的問題。 – merv 2012-08-14 21:10:32

我有同樣的問題，它是由包括JavaScript文件的雙重造成的。

我做了包括我的庫javascript文件兩次，當我刪除重複的時候，它工作的很好。

來源

2015-02-23 11:42:47 Ebrahim

Bootstrap導航摺疊一次切換

回答

相關問題