Opened 9 years ago

Closed 9 years ago

Last modified 9 years ago

#11779 closed defect (fixed)

Claro: arrows in dijit.TooltipDialog background

Reported by: samlin99 Owned by:
Priority: high Milestone: 1.5.1
Component: Dijit Version: 1.5
Keywords: Cc: Katie Vance
Blocked By: Blocking:

Description (last modified by bill)

After execute following code, you will see unknown characters display in TooltipDialog?. Please check attached pic for more reference.

Sample Code:

var dialog = new dijit.TooltipDialog({
    content: 'Test'
});
for(x=0;x<70;x++)
{
	dojo.create("div", {innerHTML:"Test"}, dialog.containerNode);
}
var button = new dijit.form.DropDownButton({
    label: "show tooltip dialog",
    dropDown: dialog
});
dojo.byId("dropdownButtonContainer").appendChild(button.domNode);

Attachments (2)

ToolTip.jpg (50.9 KB) - added by samlin99 9 years ago.
Unknown characters display in TooltipDialog?
tooltipGradient.png (2.5 KB) - added by bill 9 years ago.

Download all attachments as: .zip

Change History (7)

Changed 9 years ago by samlin99

Attachment: ToolTip.jpg added

Unknown characters display in TooltipDialog?

comment:1 Changed 9 years ago by bill

Component: GeneralDijit
Description: modified (diff)
Milestone: tbd1.6
Owner: anonymous deleted
Summary: Unknown characters display for dijit.TooltipDialogClaro: arrows in dijit.TooltipDialog background

For some reason there's this CSS rule in claro:

.claro .dijitTooltipContainer {
...
background-image:url("images/tooltip.png");
background-position:-575px 100%;
background-repeat:repeat-x;
...
}

That tooltip.png has the arrows in it.

comment:2 Changed 9 years ago by bill

Turns out tooltip.png is combining the gradient background at the bottom of a tooltip (see below) with the connector arrows from the tooltip pointing to the "around node":

As a workaround you could do this after including claro:

<style>
.claro .dijitTooltipContainer {
    background-image: none;
}
</style>

Changed 9 years ago by bill

Attachment: tooltipGradient.png added

comment:3 Changed 9 years ago by Katie Vance

Cc: Katie Vance added

comment:4 Changed 9 years ago by bill

Resolution: fixed
Status: newclosed

(In [23085]) Fix issue when arrows appear inside the tooltip (for very tall tooltips). Happened because the gradient was stored in the same image files as the arrows.

Fix from Jason Enzi (IBM, CCLA), fixes #11779.

comment:5 Changed 9 years ago by bill

Milestone: 1.61.5.1

(In [23103]) Backport tooltip embedded arrow fix to 1.5 branch, and add file missing from trunk checkin [23085], refs #11779.

Note: See TracTickets for help on using tickets.