我正在使用DOJO的ContentPane
模块。我在其中一个窗格中有一个div
元素,我需要给它一个高度 - 比ContentPane
的高度小100个像素,这样div
动态地改变它的高度您可以通过拖动分割符来更改ContentPane
大小。我是Dojo的新手,如果有人可以帮助我,我会很高兴。
感谢。
答案 0 :(得分:4)
我认为最佳解决方案是通过嵌套BorderContainers
并正确设置splitters
,因为这样dijit/layout
将负责调整大小,您不需要编写任何JavaScript代码和您的布局将完全基于CSS。
解释起来有点麻烦,所以我在jsFiddle为你创建了一个工作示例:http://jsfiddle.net/phusick/Ayg8F/ +图表:
注意:不要忘记为height: 100%
,html
和最高body
设置BorderContainer
。
此解决方案的缺点是您必须将divs
替换为ContentPanes
。如果您不想或不想,可以使用dojo/aspect
并连接到BorderContainer
或ContentPane
resize
方法,并在尺寸适当时手动调整divs
的大小变化:
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");
});
});
});