Opened 14 years ago

Last modified 13 years ago

#4393 closed task

Tooltip attached to tab opens wrong time, wrong place — at Initial Version

Reported by: guest Owned by:
Priority: high Milestone: 1.3
Component: Dijit Version: 0.9
Keywords: Cc:
Blocked By: Blocking:

Description

A tooltip can be attached to a tab container as in the following example. However, the tooltip displays when one hovers over the contents of the tab container, not over the tab (label) itself. It also displays after all the contents, which is usually nowhere near the cursor or the tab. To get the present functionality, one can just attach the tooltip to content of the tab container, but there appears to be no way to attach the tooltip to the tab (label) itself. Among other things, this means that there is no tooltip for tab contents which aren't displayed. Either in dijit.layout.TabController? or dijit.layout._TabButton, something needs to be added so that the tooltip can be properly attached to the label.

<html>

<head>

<script type="text/javascript" src="../dojoAjax/dojo/dojo.js"

djConfig="parseOnLoad:true">

</script> <script type="text/javascript" >

dojo.require("dojo.parser");

dojo.require("dijit.Tooltip"); dojo.require("dijit.layout.LayoutContainer?"); dojo.require("dijit.layout.TabContainer?"); dojo.require("dijit.layout.ContentPane?");

</script>

<style type="text/css"> @import "../dojoAjax/dijit/themes/soria/soria.css";

html, body, #mainDiv {

width: 50%; height: 100%;

}

</style>

</head> <body class="soria">

<div dojoType="dijit.Tooltip" connectId="myTab" label="This is a tab test"></div>

<div id="mainDiv" dojoType="dijit.layout.LayoutContainer?">

<div dojoType="dijit.layout.TabContainer?" layoutAlign="client">

<div id="myTab" dojoType="dijit.layout.ContentPane?" title="Tab">

<div dojoType="dijit.layout.ContentPane?">

This is a test.

</div>

</div>

</div>

</div>

</body>

</html>

<html>

<head>

<script type="text/javascript" src="../dojoAjax/dojo/dojo.js"

djConfig="parseOnLoad:true">

</script> <script type="text/javascript" >

dojo.require("dojo.parser");

dojo.require("dijit.Tooltip"); dojo.require("dijit.layout.LayoutContainer?"); dojo.require("dijit.layout.TabContainer?"); dojo.require("dijit.layout.ContentPane?");

</script>

<style type="text/css"> @import "../dojoAjax/dijit/themes/soria/soria.css";

html, body, #mainDiv {

width: 50%; height: 100%;

}

</style>

</head> <body class="soria">

<div dojoType="dijit.Tooltip" connectId="myTab" label="This is a tab test"></div>

<div id="mainDiv" dojoType="dijit.layout.LayoutContainer?">

<div dojoType="dijit.layout.TabContainer?" layoutAlign="client">

<div dojoType="dijit.layout.LayoutContainer?" title="Tab">

<div id="myTab" dojoType="dijit.layout.ContentPane?" layoutAlign="client">

This is a test.

</div>

</div>

</div>

</div>

</body>

</html>

Change History (0)

Note: See TracTickets for help on using tickets.