2

開発中の Web サイトに折りたたみ可能なメニューがありますが、折りたたみは 1 回しか切り替えられません。「メニュー」をクリックするとメニューが展開され、もう一度クリックするとメニューが閉じますが、トグルを続行しません。

ここに私の開発サーバーへのリンクがあります。「メニュー」ボタンが表示されるまでブラウザ ウィンドウのサイズを変更し、クリックします。

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>
4

2 に答える 2

4

あなたの場合の問題は、2 つの JavaScript ファイル、つまりbootstrap-transition.jsccm.app.jsの間の衝突です。どちらも jQuery 変数に書き込んでいます$.support.transitionendBootstrap では、CSS3 トランジションの最後に発生するブラウザ固有のイベントを含むプロパティを含むオブジェクトである必要があります。support.transition他のファイルは、ブール値のみになるように上書きしています。

hideメソッドが呼び出されると、andにtransitioning設定されます。これtrueは、遷移の終了を通知するイベントの名前が定義されていないため、transitioningプロパティが false にリセットされることはありません。これにより、Collapse プラグインへの、showまたはhideCollapse プラグインでの今後の呼び出しが短絡します。

You could try modifying the ccm.app.js to be compatible with Twitter Bootstrap's Transitions plugin. Simply adding a check to not overwrite existing values might suffice.

Another option is trying to ensure that bootstrap-transition.js is loaded after ccm.app.js. As long as ccm.app.js is only looking for truthy values, you should be good.

于 2012-08-14T20:30:56.050 に答える
0

JavaScriptファイルを二重に含めることによって引き起こされたのと同じ問題がありました。

ライブラリのjavascriptファイルを2回含めましたが、繰り返しのものを削除すると、うまく機能しています。

于 2015-02-23T11:42:47.207 に答える