Bootstrap 工具提示不透明度发生变化？

Question

我一直在为学习 Backbone.

而创建的基本调查网站添加一些 Twitter Bootstrap 工具提示

除了添加到分支按钮的工具提示外，我的所有工具提示看起来都是正确的。

坏的看起来是这样的：

以下是所有其他人的样子：

几乎就像它的不透明度为 0.8，而其他的不透明度为 1。但我没有改变我添加它们的方式，所以我对发生的事情感到困惑。

我发现了一个不同的 SO，建议这样做：

.tooltip.in {
    opacity: 1;
    filter: alpha(opacity=100);
}

但这似乎不起作用。

以下是我如何添加好的工具提示：

<div id="arrow-up"><i class="fa fa-arrow-up" title="You can rearrange the order that the questions appear in using the arrows next to each question." data-toggle="tooltip" data-placement="left"></i> </div>

另一个版本 ?:

<input type="checkbox" id="imageQuestion" class="image-question" checked> 
<label for="imageQuestion">Add Image to Question</label> 
<i class="fa fa-question-circle tooltip-info" title="If you would like to add an image to the question, check the 'Add Image to Question' box." data-toggle="tooltip" data-placement="right"></i>

这是我添加错误视图的方式（可能值得注意 - 此视图是包含其他工具提示的视图的子视图。问题视图有许多答案子视图）：

<a data-toggle="modal" data-target="#<%= @id %>" class="btn manage-skip active"><i class="fa fa-code-fork" title="You can branch your survey answers so that certain answers will lead to different questions. Use this to tailor your messages and survey paths to the people that you are looking to find." data-toggle="tooltip" data-placement="left"></i></a>

然后在“答案”和“问题”视图中显示工具提示视图：

onShow: ->
      $('[data-toggle="tooltip"]').tooltip()

Answer 1

问题似乎是我试图将 link 中的工具提示附加到模态框。当我将它添加到环绕 a 的 div 时，它按预期工作：

<div class="inline" title="You can branch your survey answers so that certain answers will lead to different questions. Use this to tailor your messages and survey paths to the people that you are looking to find." data-toggle="tooltip" data-placement="left"><a data-toggle="modal" data-target="#<%= @id %>" class="btn manage-skip active"><i class="fa fa-code-fork"></i></a></div>

Answer 2

Bootstrap 4.0

.tooltip.show {
  opacity: 1;
}

Bootstrap 工具提示不透明度发生变化？

Bootstrap Tooltip Opacity changes?

css

jquery

backbone.js

twitter-bootstrap

marionette