避免Dijit菜单与其目标div之间重叠

Question

我在Dijit.Menu的fiddle.net here和div中有以下代码示例。 菜单出现左键单击，我的问题是菜单重叠（或覆盖，隐藏）目标div的内容，用户在与菜单中显示的替代方法进行比较时无法读取其内容，请参见下图。 / p>

有没有办法使菜单显示而不重叠div内容，以便在浏览菜单项时可以看到div内容，也可以将菜单放在div下方或上方，如下图所示。

Answer 1

您可以使用TooltipDialog，这是基于您提供的jsfiddle。

Answer 2

这可以通过附加到显示popupMenu时触发的onOpen事件的一些javascript来实现。

代码应获取被点击元素的位置和高度，并计算应放置菜单的位置：

• x：是触发元素的x位置
• y：y位置与触发元素的高度相加

使用这些坐标设置弹出菜单持有人元素的左侧和顶部样式属性：

pMenu.connect(pMenu, 'onOpen', function () {
    var position = dojo.position(this.currentTarget, true);   
    domStyle.set(this.domNode.parentNode, {
       left: position.x + "px",
       top: (position.y + position.h) + "px"
    });
});

这是jsfiddle with the popup menu positioned as in your image