我在左窗格中有一个带有AccordionContainer {region:"left"}的BorderContainer {design:"sidebar"}.Splitter启用允许拖动AccordionContainer'关闭',但是左边的分割器仍然可以将其拖回'打开'.
如何使用代码将其从当前宽度切换到0px? - 如何获得当前宽度? - 如何设置宽度并在必要时重绘?
我不想删除Child/Addchild,因为这会删除拆分器.
[编辑:解决方案:http://jsfiddle.net/6aNrp/274/ ]
谢谢
我现在正在使用dojo 1.8.3,现在我的页面上有一个带有2个ContentPane的BorderContainer.我想听resize事件,像这样的代码
dojo.ready(function(){
dojo.connect(dijit.byId("Container"), "resize", function(changeSize, resultSize){
// do my stuff here...
});
});
Run Code Online (Sandbox Code Playgroud)
但是,如果调整大小(分裂)结束,有没有让我知道?请指教,谢谢!
我在BorderContainer中有一个dgrid,启用了"liveSplitters"(使用Dojo 1.8).dgrid很好地出现了,但是当我在左列和"前导"列(dgrid在其中)之间移动拆分器时,dgrid没有正确调整大小.但是,如果我调整窗口大小,那么dgrid会重新调整到适当的大小(即填充BorderContainer的"前导"窗格的100%).
我在CSS中将dgrid设置为100%宽度.有什么方法我需要告诉dgrid在拆分器移动后刷新它的大小?
嘿伙计们,我试图用模板中的dijit.layout对象(BorderContainer,ContentPane)创建一些自定义的模板化小部件,我只是无法让它工作.也许SO可以引导我走向正确的方向......到目前为止,这是我的代码:
的test.html
<html>
<head>
<title>Test Page</title>
<style type="text/css">
@import "http://ajax.googleapis.com/ajax/libs/dojo/1.4.1/dojo/resources/dojo.css";
@import "http://ajax.googleapis.com/ajax/libs/dojo/1.4.1/dijit/themes/tundra/tundra.css";
html, body, #page {
width: 100%; height: 100%; overflow: hidden;
}
</style>
<script type="text/javascript">
var djConfig = {
isDebug: false,
parseOnLoad: true,
baseUrl: './',
modulePaths: {'test' : '.'}
};
</script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.4.1/dojo/dojo.xd.js"></script>
<script type="text/javascript" src="test.js"></script>
<script>
dojo.require('dijit.layout.BorderContainer');
dojo.require('dijit.layout.ContentPane');
dojo.require('test.testWidget');
dojo.ready(function() {
var widget = new test.testWidget({}, 'widgetGoesHere');
});
</script>
</head>
<body class="tundra">
<div id='widgetGoesHere'></div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
testWidget.js
dojo.provide('test.testWidget');
dojo.require('dijit._Widget');
dojo.require('dijit._Templated');
dojo.require('dijit.layout.BorderContainer');
dojo.require('dijit.layout.ContentPane');
dojo.declare('test.testWidget', [ dijit._Widget, dijit._Templated], { …Run Code Online (Sandbox Code Playgroud) 我正在开发基于PHP和Dojo工具包的业务应用程序.界面类似于你在dojo dijit主题测试器上看到的.
在互联网上,需要花费大量时间来逐一加载所有这些j ..
我想知道主题测试器演示使用的最佳技术是什么,它加载速度比我们构建的快得多.
我有兴趣了解优化加载时间的最佳实践吗?
有没有办法让dijit.layout.BorderContainer身高自动增长?我尝试过设置min-height: 200px; height: auto;,但不会扩展.
我试过看API,但那件事情很乱......所以任何帮助都会受到赞赏(:
我试图以编程方式编写声明性示例,但到目前为止还没有成功. http://dojotoolkit.org/reference-guide/dijit/layout/BorderContainer.html
dojo.require("dijit.layout.ContentPane");
dojo.require("dijit.layout.BorderContainer");
dojo.addOnLoad(function() {
var borderContainer = new dijit.layout.BorderContainer({
design: "sidebar",
gutters: true,
liveSplitters: true,
id: "borderContainer"
});
borderContainer.placeAt(dojo.body(), "last");
var panelLeft = new dijit.layout.ContentPane({
content: "<p>left</p>",
splitter: true,
region: "leading",
style: "width: 300px;"
});
panelLeft.placeAt("borderContainer", "first");
var panelRight = new dijit.layout.ContentPane({
content: "<p>right</p>",
splitter: true,
region: "center"
});
panelRight.placeAt("borderContainer", "last");
});
Run Code Online (Sandbox Code Playgroud)
CSS文件: #borderContainer { width: 100%; height: 100%; }
你可以在这里看到代码:http://jsbin.com/inulig/27/edit#source
谢谢!
我无法为此找到明确定义的解决方案.大多数是不完整的片段.
这是一个简单的例子.请参阅doSomething()注释:
<head>
<style type="text/css">
body, html { font-family:helvetica,arial,sans-serif; font-size:90%; }
</style>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/claro/claro.css"/>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js"
djConfig="parseOnLoad: true">
</script>
<script type="text/javascript">
dojo.require("dijit.layout.TabContainer");
dojo.require("dijit.layout.ContentPane");
function doSomething() {
//Put code in here that identifies the clicked tab and displays it's id in the below alert
alert("Hello World!");
}
</script>
</head>
<body class=" claro ">
<div id="mainTab" dojoType="dijit.layout.TabContainer" style="width: 400px; height: 100px;" onClick="doSomething();">
<div id="tab1" dojoType="dijit.layout.ContentPane" title="My first tab" selected="true">
Lorem ipsum and all around...
</div>
<div id="tab2" dojoType="dijit.layout.ContentPane" title="My second …Run Code Online (Sandbox Code Playgroud) 如何在此Dojo/Dijit页面中滚动:
http://www.olexe.com/html/DijitScrollTest.html
我可能在tabControl中显示60或100行(id ="topTabs").
我认为必须有一个属性,如AllowScrolling但我找不到它.或者我是否需要添加子控件,然后在子控件中打开滚动.(如果您也可以将我指向Dijit doc,它是文档,那将是值得赞赏的.我一直在寻找它超过一个小时).