Give different background color to Tooltip

[Pragnesh]

Hi,

I need to give different background color to the dijit.Tooltip
Is it possible? If yes, how?

[srlawr]

Assuming you are using a standard Dojo theme, I would suggest that to change the colour of a tooltip background you could add the following definition to your custom CSS file.

.dijitTooltipContainer {
    background-color: pink !important;
}

on quick inspection this does a reasonably tidy job of roughly re-colouring the core of the background, (the !important tag may or may not only be necessary in the quick test harness I threw up to work this out)

The pointy bit of the tooltip is defined by an image sprite though, found, in Claro, at themes/claro/images/tooltip.png (instant example from google api http://ajax.googleapis.com/ajax/libs/dojo/1.6/dijit/themes/claro/images/tooltip.png) so one would suppose you will have to redraw that PNG in the corrosponding colour and then over-ride the background-image value of the dijitTooltipConnector CSS class.

[michaelgaigg]

Or you add a class to the tooltip

      this.addTagsContainer = new TooltipDialog({
        'content': this.addTagsContent,
        'class': 'tooltip-custom'
      });

and then target the tooltipcontainer and connector (if necessary)

.tooltip-custom .dijitTooltipContainer {
    background: white;
}
.tooltip-custom .dijitTooltipConnector {}