bootstrap.native: There is a serious problem with the relative positioning of the Popover when changing the container.
The problem is, if you specify a container, the indent is still calculated from the document body. In the original bootstrap 5, the calculation is done correctly. In the original bootstrap 5, there is a problem with reinitialization. To see the problem, call this code on the page http://thednp.github.io/bootstrap.native/v5.html and on the page https://getbootstrap.com/docs/5.0/components/popovers/.
(function (){
let lib = window.bootstrap || window.BSN;
console.log(lib);
let container = document.querySelector('main') || document.getElementById('use');
container.innerHTML = '<div class="bd-intro">' +
'<button id="test-popover" type="button" class="btn btn-lg btn-danger" data-bs-toggle="popover" title="Popover title" data-bs-content="And here\'s some amazing content. It\'s very engaging. Right?">Click to toggle popover</button>\n' +
'</div>' + container.innerHTML;
let element = document.querySelector('#test-popover');
element.parentNode.style.position = 'relative';
new lib.Popover(element, {container: element.parentNode, trigger: 'click'});
})();

About this issue
- Original URL
- State: closed
- Created 3 years ago
- Comments: 15 (15 by maintainers)
Commits related to this issue
- Changes: * solving #403 * solving #404 — committed to thednp/bootstrap.native by thednp 3 years ago
- Changes: * solving #403 * solving #404 — committed to thednp/bootstrap.native by thednp 3 years ago
I confirm that everything is working properly! =) Thank you very much!