Zebra_Tooltips icon indicating copy to clipboard operation
Zebra_Tooltips copied to clipboard

Tooltips on SVG elements always appear at the top-left.

Open cueedee opened this issue 1 year ago • 2 comments

We wanted to set a tooltip on an SVG element (<g> in this case). For reasons I do not claim to understand, jQuery's .outerwidth() and .outerheight() methods applied to such elements just claim that their dimensions are 0, but the result definitely is tooltips having their arrows always positioned at the top-left of that element.

Researching this a bit more turned up the suggestion to use the browser native method el.getBoundingClientRect() instead - here, here and here - for which a quick debug session revealed it to return all the positions and dimensions you could ever hope to need, all combined in one neat little package.

So the question bears asking if a desire to include support for SVG's would warrant incorporating the use of getBoundingClientRect, either in favor of-, or in addition to the myriad of currently employed jQuery utilities.

cueedee avatar Jun 07 '23 19:06 cueedee