2

こんにちは、bootstrap-sass宝石を使用したドロップダウンの次のコードがあります。

<div class="nav-collapse collapse" style="height:0px;">
            <nav>
              <ul class= "nav pull-right">
                <% if signed_in? %>
                    <li><%= link_to "Profile", current_user %></li>
                  <li><%= link_to "Users", users_path %></li>
                  <li id = "fat-menu" class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                      Account <b class="caret"></b>
                    </a>
                    <ul class="dropdown-menu">
                      <li><%= link_to "Settings", edit_user_path(current_user) %></li>
                      <li class="divider"></li>
                      <li>
                        <%= link_to "Sign out", signout_path, method: "delete" %>
                      </li>
                    </ul>
                  </li>
                  <% else %>
                    <li><%= link_to "Sign In", signin_path %></li>
                <%end%>
              </ul>
            </nav>
        </div>

ただし、クリックするAccountと、内容ではなく、次のみが表示されます。

ここに画像の説明を入力

クリックされたことを示す小さな白い三角形が表示されますが、コンテンツはありません。デバッグ中は、ここにクロムのメニューも表示されます。 ここに画像の説明を入力

4

3 に答える 3

0

最初の div で折りたたむ場合は、次を使用します。

.collapse .dropdown{
  overflow: visible !important;
}
于 2012-12-27T00:56:25.433 に答える
0

理解した。collapse最初の divにクラスは必要ありません。

于 2012-06-10T06:26:28.313 に答える
0

それ以外の:

<a href="#" class="dropdown-toggle" data-toggle="dropdown">
  Account <b class="caret"></b>
</a>

以下を使用する必要があります。

<a href="#fat-menu" class="dropdown-toggle" data-toggle="dropdown">
  Account <b class="caret"></b>
</a>

また、このメニューを有効にする JavaScript ファイルを提供してください (JS ファイルだけでなく、どこかでドロップダウンを有効にする必要があります)。次のようになります。

$(".dropdown-toggle").dropdown();
于 2012-06-10T04:21:08.730 に答える