如何強制Dojo TitlePane與CSS重疊？

Question

我有這jsfiddle其中有兩個TitlePane小工具在中心窗格的右上角。現在，當點擊右邊的TitlePane（「開關底圖」）時，它會導致左邊的TitlePane（「地圖疊加圖」）向左移動。相反，我想在右邊TitlePane打開時隱藏左邊的TitlePane而不是移動它。

我曾嘗試玩z-index,overflow,position,float，但沒有運氣到目前爲止。我對Dojo相當陌生，所以我認爲我沒有找到風格參數的正確組合。

有沒有人有任何想法？

在此先感謝！

Answer 1

嘗試給你的titlepanes一個id，然後添加evenhooks，如下所示。爲了給一個小部件一個id，只需將它放入道具中即可，如id:'leftId'。我將在例子中使用你的classNames作爲id。

dojo.addOnLoad(function() { 
    var wLeft = dijit.byId('leftTitlePane'); 
    var wRight = dijit.byId('rightTitlePane'); 
    dojo.connect(wLeft, 'onShow', function() { 
     wRight.domNode.style.display = 'none'; 
    }); 
    dojo.connect(wLeft, 'onHide', function() { 
     // wait a few for collapse to finish 
     setTimeout(function() {wRight.domNode.style.display = '';}, 120); 
    }); 
    dojo.connect(wRight, 'onShow', function() { 
     wLeft.domNode.style.display = 'none'; 
    }); 
    dojo.connect(wRight, 'onHide', function() { 
     // wait a few for collapse to finish 
     setTimeout(function() {wLeft.domNode.style.display = '';}, 120); 
    }); 
});