layout - ContentPaneのサイズ変更時にDOJOContentPaneの内部DIVの高さが変更される

Question

DOJOのContentPaneモジュールを使用しています。ペインの1つに要素があり、特定の高さを指定する必要があります。スプリッターをドラッグしてサイズを変更すると、高さが動的に変更されるようにdiv、高さより100ピクセル低くします。私は道場に不慣れで、誰かがこれを手伝ってくれたら嬉しいです。ContentPanedivContentPane

ありがとう。

Answer 1

BorderContainers適切に設定されたネストを使用するのが最善の解決策だと思います。そうするsplittersことdijit/layoutでサイズ変更が処理され、JavaScriptコードを記述する必要がなく、レイアウトはCSSのみに基づくためです。

説明するのはちょっと面倒なので、jsFiddleで実用的な例を作成しました：http：//jsfiddle.net/phusick/Ayg8F/ +図：

注意： 、、およびトップに設定height: 100%することを忘れないでください。htmlbodyBorderContainer

このソリューションの欠点は、plaindivsを。に置き換える必要があることですContentPanes。サイズが変更されるたびに、手動でサイズを変更したくない、またはできない場合は、またはメソッドを使用dojo/aspectして接続し、サイズを変更できます。BorderContainerContentPane resizedivs

require([
    "dojo/ready",
    "dojo/aspect",
    "dijit/registry",
    "dijit/layout/ContentPane",
    "dijit/layout/BorderContainer"
], function(
    ready,
    aspect,
    registry
) {

    ready(function() {
        var bc = registry.byId("borderContainer1");
        aspect.after(bc, "resize", function() {
            // calculate and set <div> size here
            console.log("resize divs");
        });
    });  
});​