Geek Answers Handbook

How to set max dijit.ToolTip width?

I tried the following, but it did not work.

var helpIcon = dojo.create("span", {"class":"help-icon", innerHTML:"[?]"}, td1);
var tooltip = new dijit.Tooltip({
        connectId: [helpIcon],
        label: "large paragraph of text here ... "
    });
tooltip._setStyleAttr("max-width: 100px");

Help!

+5
source share
3 answers

Through experiments, I found that this works:

.dijitTooltip {max-width: 50em;}

+8
source

Just put the div inside ToolTipand limit its width:

<span id="a">Some Text</span>
<div dojoType="dijit.Tooltip" connectId="a" position="below">
    <div style="width: 400px;">Some Info Some Info Some Info Some Info 
    Some Info Some Info Some Info Some Info Some Info Some Info Some Info 
    Some Info Some Info Some Info Some Info Some Info Some Info Some Info 
    Some Info Some Info Some Info Some Info Some Info Some Info </div>
</div>
+2
source

Note that style changes apply to all tooltips on the page. Dojo creates (if necessary) 1 common dijit._MasterTooltip object containing domtip vertices, and all tooltips use it. The following code adds custom css classes to the container and the rooltips connector.

if(!dijit._masterTT)
    dijit._masterTT = new dijit._MasterTooltip();
// Add a css class to the container
if(dijit._masterTT.domNode.childNodes[0])
    dojo.addClass(dijit._masterTT.domNode.childNodes[0], "classContainer");
// Add a css class to the connector
if(dijit._masterTT.domNode.childNodes[1])
    dojo.addClass(dijit._masterTT.domNode.childNodes[1], "classConnector");
0
source

More articles:


All Articles