定位dojo dijit.form.DropDownButton的内容

Positioning the contents of a dojo dijit.form.DropDownButton?

本文关键字：DropDownButton form dojo dijit 定位      更新时间：2024-04-07

我有这个jsfiddle，右上角有三个按钮。

一直向右的两个按钮"Basemaps"answers"Legend"的内容按预期向左打开，这样它们就不会走出浏览器窗口。左侧按钮"Map Overlays"的内容向右打开，因为它有这样做的空间

是否可以更改这些DropDownButton的内容，以便在默认情况下，它们都将内容的右侧与按钮的右侧对齐？

也就是说，我希望左侧按钮（"Map Overlays"）的打开内容以与其他按钮的打开内容相同的方式定位。

修复了具有所需功能的jsfiddle。

我已经通过为DropDownButton的onMouseDown事件添加一个dojo.connect解决了这个问题。我根据DropDownButton的x位置和宽度计算ContentPane的新x位置。然后，我找到ContentPane的DOM节点的父节点节点，并将其left样式参数设置为新的x位置。

dojo.connect(dijit.byId("mapOverlayDropdown"), 'onMouseDown', function() {
    console.log("shown");
    var button = dijit.byId("mapOverlayDropdown").domNode;
    var gallery = dijit.byId("mapOverlayGallery").domNode.parentNode;
    var buttonPos = dojo.position(button, true);
    var galleryPos = dojo.position(gallery, true);
    var newX = buttonPos.x + buttonPos.w - galleryPos.w;
    gallery.style.left = newX.toString() + "px";
});
相关文章：