Hi,
I’m trying to achieve layout where I will have one window on top that will have 100%, and two windows under this main window 50% each and user should be able to swap them and then, whatever window on top will become 100% and two on bottom 50% each in width. I can’t figure out how to set this deal still.
<div id="docking">
<div id="panel1">
<div id="window1" >
<div>Header 1</div>
<div style="overflow: hidden;">Content 1</div>
</div>
</div>
<div id="panel2">
<div id="window2" >
<div>Header 2</div>
<div style="overflow: hidden;">Content 2</div>
</div>
<div id="window3" >
<div>Header 3</div>
<div style="overflow: hidden;">Content 3</div>
</div>
</div>
</div>
and setting in JS
$("#docking").jqxDocking({
width: 900,
orientation: 'vertical',
theme: 'classic',
floatingWindowOpacity: 0.4 ,
mode: 'docked' ,
windowsMode: {
'window1': 'docked',
'window2': 'docked',
'window3': 'docked'
}
});