4

为了在狭窄的表格单元格中节省空间，我想使用引导工具提示在悬停时显示额外的内容。但是，工具提示在 a 标记中使用 :rel 选项。我不需要链接，只需要它的选项......而且我不希望链接去任何地方。我用过：

  link_to display.text, "#", :rel => "tooltip", ...blah..blah
  link_to_function display.text, "#", :rel => ...blah...blah

两者都在一定程度上起作用，但都返回到页面顶部。

使用不是真正的链接来获取其他功能的链接可能是臭代码。有没有创建虚拟链接的rails方式？是否有“批准”的方法来实现这一点？

4

2 回答 2

8

您可以在锚点以外的其他元素上初始化工具提示。尝试跨度或 div。

于 2012-10-23T20:08:31.297 回答
0

我同样需要向元素添加工具提示，但我不希望它成为标签。

我选择使用这样的标签：

<span class="glyphicons glyphicons-medicine pharmacy-icon" data-toggle="tooltip" data-placement="right" title="Pharmacy Tooltip"></span>

将显示（当悬停在医学字形图标上时）消息：药房工具提示

如果您想更进一步，您甚至可以根据需要设置工具提示的样式，以下代码块将是您如何更改它的样式：

.tooltip {
  filter: drop-shadow(rgba(0, 0, 0, 0.3) 0 2px 5px);
  .tooltip-inner {
    background-color: white;
    color: red;
  }
  .tooltip-arrow {
    border-right-color: white;
  }
}

这会将工具提示的背景颜色和工具提示的箭头更改为白色，带有红色文本和工具提示周围的阴影。

如果您使用引导程序，请确保在将使用工具提示的地方包含以下代码行：

$('.someClass').tooltip();

这将确保您使用的是引导工具提示，而不是默认的内置浏览器工具提示

于 2017-06-12T13:06:43.943 回答