Popover имеет непрозрачность: 0 на шоу

Question

У меня есть кнопка из документации Bootstrap 4:

<button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
  Popover on top
</button>

и под ней метод:

$(function () {
  $('[data-toggle="popover"]').popover({
    container: 'body',
    trigger: 'click',
  })
})

При проверке HTML я вижу, что естьпоказывается новый div <div class="popover fade top in".. которого не видноПри проверке элемента у него есть класс, который его скрывает:

.fade:not(.show){
  opacity: 0;
}

При его переключении показывается всплывающее окно в соответствии с назначением. Любые подсказки, что я делаю не так?

Answer 1

Проблема с выбором классов, которые находятся на поповере. Как вы правильно заявили .fade:not(.show), но ваши классы <div class="popover fade top in"... Так что проблема в том, что он использует .in вместо .show. Так что я думаю, что где-то есть разница в версии, потому что я думаю, что у popovers в bootstrap 3 раньше было in, тогда как bootstrap 4 использует show

Выустановить это может быть где-нибудь вручную, используя события начальной загрузки? Или, может быть, вы импортировали неверную версию bootstrap.js?