Bootstrap 4 привязки троса

Question

Bootstrap 4 с использованием tether.js как для позиций, однако он поддерживает только 4 позиции, «сверху» «справа» «снизу» «влево», как я могу расширить до большего количества опций, которые поддерживают 12 из них ? Например, «верхний левый» или «верхний правый»

Answer 1

Кажется, что ботстрап принимает только 4 placement options - проверьте открывание github issue.

В настоящее время самонастройки поддерживает только 4 варианты размещения, в то время как фал поддерживает 12.

Таким образом, используя бутстрэпы подсказки не поможет, но вы всегда можете использовать tether.js или это tooltip.js.

Вот пример использования tooltip.js:

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

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

<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>

Также здесь это the fiddle