Search code examples
javascriptjquerycsstwitter-bootstrapbootstrap-popover

Repositioning Popover without reloading it


I am now facing the problem with bootstrap popover position. I am using popover to show the list of images that user has chosen and allowing user to review and remove images inside the popover.

My problem is, after user has removed the image from the popover, the height of the popover was changed and the whole popover shifted to top. The arrow icon also shifted.

I can reposition the popover by initializing it but I don't think it is a good way to do as it cause the flickering while reloading content.

I had created a fiddle for you to see my problem.

In my fiddle, uncomment the code inside removeImage function to see repositioning with flickering.

Please advice, Thanks in advanced


Solution

  • Add animation: false to the initializer and uncomment the code you have and it works cleanly.

    $('#aPopover').popover({
    title: 'Selected Images',
    html: true,
    content: getSelectedImages,
    placement: 'right',
    animation: false
    });