Tim
Tim

Reputation: 35

Bootstrap tooltip makes element flicker

In my application, I use the bootstrap tooltips but whenever I hover over a button that uses tooltips one of my elements starts flickering. What could cause this issue?

This is how I create the tooltip:

$('[data-toggle="tooltip"]').tooltip({placement:"auto"});

Here is an example https://jsfiddle.net/oLkuat84/10/

Upvotes: 1

Views: 1951

Answers (1)

user1575941
user1575941

Reputation:

This seems to be a browser issue. Your JS works with no flicker on OSX->Firefox and OSX->Chrome but has that horrible red/blue flicker in OSX->Safari (where does the blue come from?)

You can isolate the problem by removing the top and left attributes from the style-switcher-btn-3 class.

From what I can gather: it's that safari is re-rendering the two fixed-position items (the tooltip and the style-switcher-btn-3) and this cases the flicker. Where the blue colouring comes from I have no idea.

If at all possible, try to make that button grouping not a position:fixed.

Upvotes: 2

Related Questions