【Bootstrap Tooltip】
1、设置Tooltip:
1)data-toggle="tooltip"
2)data-placement="top", 设置位置,可以为上、下、左、右
3)title="顶部的 Tooltip",设置内容
2、使用Tooptip,必须调用以下代码激活;
<script>
$(function () { $("[data-toggle='tooltip']").tooltip(); });
</script>
3、Tooltip常见方法:
方法 | 描述 | 实例 |
---|---|---|
Options: .tooltip(options) | 向元素集合附加提示工具句柄。 |
$().tooltip(options)
|
Toggle: .tooltip('toggle') | 切换显示/隐藏元素的提示工具。 |
$('#element').tooltip('toggle')
|
Show: .tooltip('show') | 显示元素的提示工具。 |
$('#element').tooltip('show')
|
Hide: .tooltip('hide') | 隐藏元素的提示工具。 |
$('#element').tooltip('hide')
|
Destroy: .tooltip('destroy') | 隐藏并销毁元素的提示工具。 |
$('#element').tooltip('destroy')
|
4、title可以是一个html字符串:tooltip({html : true }
<a href="#" data-toggle="tooltip" title="<h2>'am Header2 </h2>">Tooltip 方法 options</a>.
参考:http://www.runoob.com/bootstrap/bootstrap-tooltip-plugin.html