Hi zircon,
Below is an example of Splitter initialization with 3 panels. The panel sizes grow and shrink when the page size is changed. However, this continues until the user manually changes the panels size by dragging a split bar.
<!DOCTYPE html><html lang="en"><head> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxsplitter.js"></script> <style type="text/css"> html, body { height: 100%; width: 100%; margin: 0px; padding: 0px; overflow: hidden; } </style> <script type="text/javascript"> $(document).ready(function () { $('#mainSplitter').jqxSplitter({ width: '100%', height: '100%', panels: [{ size: '25%' }, { size: '50%' }, { size: '25%'}] }); }); </script></head><body class='default'> <div id="mainSplitter"> <div> Column 1</div> <div> Column 2</div> <div> Column 3</div> </div></body></html>
Best Regards,
Peter Stoev
jQWidgets Team
http://www.jqwidgets.com
