dojo - How to position a dijit.menu relative to its trigger? -
I've got a few menus like this:
// context menu // Trigger & lt; Div id = "contextMenuTrigger0" & gt; 0 & lt; / Div & gt; & Lt; Div id = "contextMenuTrigger1" & gt; 1 & lt; / Div & gt; // Menu and Lieutenant; Div dojoType = "dijit.Menu" targetNodeIds = "contextMenuTrigger0, context menu" leftClicktoOpen = "true" style = "display: none" & gt; & Lt; Div dojoType = "dijit.MenuItem" class = "first" & gt; Item A & lt; / Div & gt; & Lt; Div dojoType = "dijit.MenuItem" & gt; Item two & lt; / Div & gt; & Lt; Div dojoType = "dijit.MenuItem" & gt; Item three & lt; / Div & gt; & Lt; Div dojoType = "dijit.MenuItem" & gt; The item has four really, really long items. & Lt; / Div & gt; & Lt; / Div & gt;
And this:
// Tools menu // triggers & lt; Div id = "toolsButton" & gt; Device & lt; / Div & gt; // Menu and Lieutenant; Div dojoType = "dijit.Menu" class = "toolsMenu" targetNodeIds = "toolsButton" leftClicktoOpen = "true" style = "display: none" & gt; & Lt; Div dojoType = "dijit.MenuItem" class = "first" & gt; Item A & lt; / Div & gt; & Lt; Div dojoType = "dijit.MenuItem" & gt; Item two & lt; / Div & gt; & Lt; Div dojoType = "dijit.MenuItem" & gt; Item three & lt; / Div & gt; & Lt; Div dojoType = "dijit.MenuItem" & gt; Item four & lt; / Div & gt; & Lt; / Div & gt;
Right now, when the menu opens, it appears under the mouse I want to show it in a specific position relative to the trigger * I got the startup and OnOpen events and a function that Tried writing the style set of domNode in the menu, but they did not seem to be effective.
In addition to this, I did not know which node is triggered in context, where there are many.
I saw & amp; , But was not able to get along very much with them.
* Fwiw, I want to deploy them so that the upper-left corner reference of the menu is aligned with the upper-right corner of the trigger, and with the lower left corner of the tool menu.
After I found the following CSS override works well, then you just have a relative difference in automatic position Wish:
.dijitMenuPopup {margin-left:! -25px Important; Margin-top: 15px! Important; }
Comments
Post a Comment