css - Bootstrap 工具提示 css 不起作用

标签 css twitter-bootstrap tooltip

我正在尝试使工具提示起作用,顺便说一句,但由于未知原因,没有将 CSS 应用于工具提示。由于整个站点在 Bootstrap 本身(Wordpress 插件)中运行良好,所以我在这个元素上摸不着头脑。

代码如下。

<a href="tel:<?php echo $phone;  ?>" data-toggle="tooltip" title="<?php echo $phone; ?>"  data-placement="bottom">
    <span class="fa-stack fa-lg">
        <i class="fa fa-circle fa-stack-2x fa-inverse"></i>
        <i class="fa fa-phone fa-stack-1x"></i>
    </span> 
</a>

和JS。
$(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip(); 
});

工具提示在我的屏幕左侧(虽然它应该在元素下方)显示为未设置样式,但未设置样式。我的 Bootstrap 插件是最新的并运行 css 版本(v3.3.6),所以我想知道是否需要为 Bootstrap 工具提示获取外部工作​​表。

它没有说:http://www.w3schools.com/bootstrap/bootstrap_tooltip.asp

最佳答案

你必须把 bootstrap.min.js 放在 jquery-ui.js 之后!
它的全部。

<script type="text/javascript" src="path/jquery.js"></script>
<script type="text/javascript" src="path/jquery-ui.js"></script>
<script type="text/javascript" src="path/bootstrap.min.js"></script>

关于css - Bootstrap 工具提示 css 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36979255/

相关文章:

css - node.js 不会在所有页面加载 css 样式

jquery - 让 CSS Transition 发生不止一次?

javascript - bootstrap js工具提示显示html内容

html - 悬停时不显示工具提示文本

css - 如何替换此 XenForo 样式的 Font Awesome Logo ?

css - IE10、IE11 中的跨浏览器 css 渐变

html - 在 Bootstrap 4 中使 3 列宽度为 75% 并居中对齐

javascript - 修复嵌套列上的 Bootstrap 填充

html - 摆脱图片库中的空白

java - setToolTipText 消耗鼠标事件的解决方法?