I am trying to use Bootstrap popover where the popover is shown either at the top or the bottom, activated by mouseenter event. Works well the first time. When the popover is hidden, page scrolled down & popover reopened, the new placement should be altered based on the new position. But it fails to change the position. The popovers are made in C# producing this HTML code:

    Blah Blah Blah " data-original-title="Referanse">Blah

Works nice. Sorry for the BAD HTML code shown. It is not so important, and I am new to the forum. The HTML code seems not to be the problem. The problem is the positioning when the page is scrolled. It will place it based on this simple javascript mouseenter code:

// Place the popover based on the target client rect
// This method has a flaw, thus not implemented.
// The popover method has its method created in HTML only one time
// when it is shown for the first time. When it is hidden, then shown
// the placement option is not changed, regardless of below code. Need more
// investigation to resolve.
var popRect = e.target.getBoundingClientRect();
if (popRect.y < 150) {
    $(e.target).popover({ placement: "bottom" });
    console.log('bottom');
} else {
    $(e.target).popover({ placement: "top" });
    console.log('top');
}
$(e.target).popover('show');

It seems that the HTML popover insert are created only one time. Can anybody help with this issue?