私はRuby on Rails（Railsチュートリアルサンプルアプリケーション）でBootstrap 3を使用しています。私のアプリでは、ユーザーはマイクロポスト（ポップス）を好き（「味わい」）ことができます。投稿に0以上の好きなものがある場合は、好きなユーザーのGravatarアイコンをドロップダウンメニューに表示するには、[＃likes]表示ボタンが必要です。私は多かれ少なかれ働いている。しかし、ボタンをクリックするとドロップダウンが開き、数秒で自動的に閉じます。ユーザーがサムネイルの1つまたはページ上の他の場所（またはボタン上）をクリックするまで、開いたままにしておきたい。私が見てきた（どれもこの問題を抱えていない）例は、このように画像のサムネイルを使用せず、通常はドロップダウンリストにリストを並べただけです。私はこれについて正しく行きますか、それとも良い方法がありますか？ブートストラップドロップダウンボタンメニューが消える
また、javascript/jQueryの実装については、完全にn00bです。私はコードを理解していますが、どこに配置する必要があるのか、どこでコードを動作させるために必要なのかわかりません。ですから、javascript/jQueryの修正がある場合は、どこに行きたいか正確に教えてください。
注：これは、クリックするとドロップダウンメニューが消える以前に尋ねられた別の問題とは異なります。私がすばやくいるなら、サムネイルをクリックして、ちょうどよいリンクを訪れることができます。問題は、何かをクリックする前（そして私の上にカーソルを置いている間）にメニューが通常数秒後に消えてしまうことです。これは、サムネイルをタップしようとしているときに常にドロップダウンがすぐに閉じるため、モバイルでは特に苛立っています。
_micropost.html.erb
<li id="micropost-<%= micropost.id %>">
<%= link_to gravatar_for(micropost.user, size: 50), micropost.user %>
<span class="user"><%= link_to micropost.user.name, micropost.user %></span>
<span class="content">
<%= micropost.content %>
<%= image_tag micropost.picture.url if micropost.picture? %>
</span>
<span class="timestamp">
Popped <%= time_ago_in_words(micropost.created_at) %> ago.
<span class="dropdown">
<% if micropost.likers(User).count == 0 %>
<div id="like">
<%= pluralize(micropost.likers(User).count, "savor", "savors") %>
</div>
<% else %>
<div class="btn-group"> //button dropdown
<button type="button" class="btn btn-xs btn-default dropdown-toggle" data-toggle="dropdown" data-target="#" aria-haspopup="true" aria-expanded="false">
<%= pluralize(micropost.likers(User).count, "savor", "savors") %>
<span class="caret"></span>
</button>
<div class="user_avatars dropdown-menu" aria-labelledby="dropdownMenu1">
<% micropost.likers(User).each do |user| %>
<%= link_to gravatar_for(user, size: 30), user %>
<% end %>
</div>
</div>
<% end %>
<% if current_user.likes?(micropost) %>
<%= content_tag(:div, "Savored", class: "btn btn-xs btn-primary", disabled: true) %>
<% elsif (current_user != micropost.user) %>
<%= link_to 'Savor', micropost, action: :update, method: :put, class: "btn btn-xs btn-primary" %>
<% else %>
<% end %>
<% if current_user?(micropost.user) %>
<%= link_to "delete", micropost, method: :delete,
data: { confirm: "You sure?" } %>
<% end %>
</span>
</span>
</li>
事前に
.user_avatars {
overflow: auto;
margin-top: 10px;
.gravatar {
margin: 1px 1px;
}
a {
padding: 0;
}
}
おかげcustom.css.scssから。