放置dojo dijit.form.DropDownButton的內容？

Question

我有這個jsfiddle ，在右上角有三個按鈕。

一直向右的兩個按鈕的內容（“底圖”和“圖例”）按預期向左打開，因此它們不會超出瀏覽器窗口。 左按鈕的內容“ Map Overlays”向右打開，因為它有足夠的空間這樣做。

是否可以更改這些DropDownButtons的內容，以便默認情況下它們都將自己定位為使內容的右側與按鈕的右側對齊？

IE，我希望左按鈕的打開內容（“地圖疊加層”）的位置與其他按鈕的打開內容相同。

Answer 1

修復了具有所需功能的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";
});