html - uib-tooltip 没地方显示时显示不全?

标签 html css tooltip angular-ui-bootstrap

演示 here .

tooltip显示不全,因为我觉得没有地方可以显示,但是有什么其他办法可以实现吗?我不能把位置改成相对的,必须 overflow hidden 。

<html ng-app="ui.bootstrap.demo">

<head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.js"></script>
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.0.js"></script>
    <script src="example.js"></script>
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">
</head>

<body class="container-fluid">
  <div style="margin-left:40px;border:1px solid;overflow:hidden;position:absolute;width:150px">
    <div class="row" style="margin-top:80px;margin-left:50px">
      <button class="btn btn-default" tooltip="This tooltip is clipped" tooltip-placement="left">#1</button>
    </div>
  </div>
</body>

</html>

最佳答案

您可以附加 tooltip element到文档的主体而不是包含元素。

tooltip-append-to-body $ C (Default: false, Config: appendToBody) - Should the tooltip be appended to '$body' instead of the parent element?

将此添加到您的按钮

tooltip-append-to-body="true"

Forked demo

关于html - uib-tooltip 没地方显示时显示不全?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48935789/

相关文章:

javascript - 当用户继续进行下一次点击时,如何让 JavaScript 清除之前的 onclick 元素?

javascript - JQuery 按钮将侧边菜单移动到左侧并使用动画将内容 View 调整为全宽不工作

css - Scrapy 无法通过 CSS 或 xPath 请求文本

html - 占位符总是在 safari 中左对齐

javascript - 具有属性长度的 JQuery HasAttribute 选择器

jquery - 根据容器 div 宽度向 <li> 元素添加类

java - 使用 XML 文件持续更新网页

html - Bootstrap 3 模板,所有内容都在一页上

javascript - 在工具提示内显示 Amcharts 饼图

c# - 如何在屏幕中央显示工具提示?