Opened 10 years ago

Closed 10 years ago

Last modified 7 years ago

#14122 closed defect (fixed)

Tooltip: gets shifted to the left when placed on element near window borders

Reported by: Andreas Seifert Owned by: bill
Priority: high Milestone: 1.8
Component: Dijit Version: 1.6.1
Keywords: Cc:
Blocked By: Blocking:


I had the problem that when I attach a tooltip to an element which is floated to the right of the screen (or put there via text-align), tooltips like to get shifted to the left, even if there is enough space left.

Also, sometimes it's the case that on the first hover over the item, the tooltip is in the proper location but on the following times it's shifted.

Change History (7)

comment:1 Changed 10 years ago by Andreas Seifert

Occurs on: Windows XP SP3, Firefox 7.0.1

comment:2 Changed 10 years ago by bill

You'll need to attach a test case using the "attach file" button. It should be as small as possible to still reproduce the problem, ideally a single HTML file..

comment:3 Changed 10 years ago by Andreas Seifert

I created a fiddle, which results in a very similar problem, where the tooltip gets displaced to the right on the second and following hovers (WinXP SP3, FF 7.0.1):

Last edited 10 years ago by Andreas Seifert (previous) (diff)

comment:4 Changed 10 years ago by bill

Thanks for that, I do see that behavior. Very odd.

comment:5 Changed 10 years ago by bill

Milestone: tbd1.8
Owner: set to bill
Status: newassigned
Summary: Dijit.ToolTip gets shifted to the left when placed on element near window bordersTooltip: gets shifted to the left when placed on element near window borders

OK, well starting in 1.7 there's a new alignment option of "below-centered" that would look better for tooltips and may work around this problem.

What's happening with your test case is that it starts off aligning the left edge of the tooltip to the left edge of the image (aka anchor node), but the second time it aligns the right edges, because it thinks that aligning the left edges would make the tooltip overflow past the edge of the viewport. This is due to an error in the calculations in Tooltip::orient(), which incorrectly assumes that the connector (the Tooltip's arrow icon) is to the left or right of the Tooltip's content, rather than above or below it as in this case. I'll fix that.

BTW, in the future please attach a test case, so I don't need to reconstruct one by pasting together the various screens from the fiddle.

comment:6 Changed 10 years ago by bill

Resolution: fixed
Status: assignedclosed

In [26938]:

Fix calculations in Tooltip.orient() for when Tooltip is above/below rather than to the left or the right. It's suspicious though why we need to measure the size of the connector at all, rather than just measuring the size of the whole tooltip.

Fixes #14122 !strict.

comment:7 Changed 7 years ago by Bill Keese <[email protected]…>

In ff4671ee94323a629ecc09d4b6fffdecb2a72fee/dijit:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 
Note: See TracTickets for help on using tickets.