Question

Bootstrap 4使用tether.js作为位置，但是它只支持4个位置，“top”“right”“bottom”“left”，我怎样才能扩展到更多选项，系绳支持12个？示例“左上角”或“右上角”

Answer 1

似乎引导程序只接受4 placement options - 检查打开github issue。

目前bootstrap仅支持4个放置选项，而tether支持12个。

因此，使用bootstraps工具提示对您没有帮助，但您始终可以使用tether.js或tooltip.js。

以下是使用tooltip.js的示例：

＆＃13;

new Tooltip({
  target: document.getElementById('foobar'),
  position: 'right middle',
  content: '<div id="foo">bar</div>',
});

＆＃13;

#foo{
  background-color: black;
  color: red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/tether-tooltip/1.2.0/css/tooltip-theme-arrows.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.3.2/js/tether.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether-drop/1.4.2/js/drop.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether-tooltip/1.2.0/js/tooltip.min.js"></script>

<a href=# id="foobar">I'm a link!</a>

＆＃13;

此处还有the fiddle

Bootstrap 4系绳放置

1 个答案: