该系统现在并不理想,所以我一直通过resize
处理面板自动调整大小的端口事件连接内容和面板。这是它的工作原理。
在您的 Panel 或 main.js 代码中侦听resize
事件。
Panel.port.on("resize", function (sizes) {
Panel.resize(sizes.width, sizes.height);
});
然后在您的内容面板代码中使用类似以下的内容(当 DOM 准备好时):
$(window).bind('resize', function () {
self.port.emit("resize", { "width" : $("body").width(),
"height" : $("body").height() });
});
resize
每次内容窗口大小从展开或折叠发生变化时,这将通过面板端口系统发送一个事件。
(更新)
如果您没有$(window).resize()
从 DOM 获得事件,那么您将不得不将更多手动的东西连接到您的 slideToggle 函数。尝试将回调函数连接到您进行的每个 slideToggle 调用。这是一个例子:
function emitResize() {
self.port.emit("resize", { "width" : $("body").width(),
"height" : $("body").height() });
}
$('#yourid').slideToggle('fast', emitResize);
当页面大小完成更改时,这将在每个 slideToggle 动画之后触发 resize 事件。如果您为文档设置了静态宽度或高度,您可能希望更改$("body").width()
和$("body").height()
调用以使用包含 div。