onResizeFinish event
onResizeFinish
logs
resize window to change size of mainLayout
resize cells of mainLayout to change size of layout2U
resize window to change size of mainLayout
resize cells of mainLayout to change size of layout2U
</> Source
<!DOCTYPE html>
<html>
<head>
<title>onResizeFinish event</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<link rel="stylesheet" type="text/css" href="../../../codebase/fonts/font_roboto/roboto.css"/>
<link rel="stylesheet" type="text/css" href="../../../codebase/dhtmlx.css"/>
<script src="../../../codebase/dhtmlx.js"></script>
<style>
div#layoutObj {
position: relative;
margin-top: 10px;
margin-left: 10px;
width: 600px;
height: 400px;
}
div.info {
margin: 0px 10px;
font-weight: bold;
font-size: 15px;
color: #3b5e7c;
}
div#logsHere {
position: relative;
height: 100px;
border: #dfdfdf 1px solid;
padding: 4px;
margin: 30px 10px 10px 10px;
font-size: 14px;
font-family: Roboto, Arial, Helvetica;
color: #404040;
overflow: auto;
}
div#winVP {
position: relative;
height: 450px;
border: #dfdfdf 1px solid;
border-radius: 2px;
margin: 10px;
}
</style>
<script>
var dhxWins, w1, mainLayout, layout2E;
function doOnLoad() {
dhxWins = new dhtmlXWindows();
dhxWins.attachViewportTo("winVP");
w1 = dhxWins.createWindow("w1", 20, 30, 600, 400);
mainLayout = w1.attachLayout({
pattern: "3L",
cells: [
{id: "a", text: "mainLayout [a]"},
{id: "b", text: "mainLayout [b]"},
{id: "c", text: "mainLayout [c]"}
]
});
mainLayout.attachEvent("onResizeFinish", function(){
writeLog("event onResizeFinish called for mainLayout");
});
layout2U = mainLayout.cells("c").attachLayout({
pattern: "2U",
cells: [
{id: "a", text: "layout2U [a]"},
{id: "b", text: "layout2U [b]"},
]
});
layout2U.attachEvent("onResizeFinish", function(){
writeLog("event onResizeFinish called for layout2U");
});
}
var logInd = 1;
function writeLog(text) {
document.getElementById("logsHere").innerHTML += "<br>"+(logInd++)+") "+text;
document.getElementById("logsHere").scrollTop = document.getElementById("logsHere").scrollHeight;
}
function doOnUnload() {
if (dhxWins != null && dhxWins.unload != null) {
dhxWins.unload();
dhxWins = null;
}
}
</script>
</head>
<body onload="doOnLoad();" onunload="doOnUnload();">
<div class="info">
<div class="info_title">onResizeFinish</div>
</div>
<div id="winVP"></div>
<div id="logsHere">
logs<br>
resize window to change size of mainLayout<br>
resize cells of mainLayout to change size of layout2U
</div>
</body>
</html>
Documentation
Check documentation to learn how to use the components and easily implement them in your applications.