Hi,
I have a web splitter on a master page with a number of different panes. If my browser window is maximized, and I un-maximize the browser, the splitters do not resize to the new width of the browser, causing horizontal scroll bars to appear at the bottom of the page. The controls nested inside the splitter already have horizontal scroll bars so this cannot happen.
The splitters are in a horizontal orientation, with heights specified (no widths). The main WebSplitter tag has a 100% width specified. The wierd thing is that when the browser is un-maximized and I maximize it, the splitters expand to fill the width of the page. It does not work in the other direction.
I tried using jquery to resize a wrapper div, but the scroll bars continued to appear. I hid the overflow of the wrapper div and the scroll bar disappeared, but the content is no longer centered and it looks sloppy. There must be a way to resize the websplitter when the browser window goes down in size. I am OK with using jquery to do so, but cannot find anything in the javascript documentation to accomplish this.
Please let me know if there is anything within your API that allows this.
Thanks.
Even I too have the same problem. However I tried by giving "dynamicresize" property value to "true" then also it's not working.
Thanks for any help you can provide.
Chinna.
I have a similar issue that i cannot solve. I have tried all the existing remodies on the forums and none work for me. i am using the 2010.3 (build 10.3.20103.2073) of the web splitter.
I have a page layout and using jquery UI users can drag and drop items to different columns on the page like shown below. the issue is when a user drops the container that contains a splitter control is does not resize the child contents. if i move the splitter, the control resizes its children correctly. if i change the window size, it resizes the child controls correctly. its just the initial drop that does not triger an event. i have the onresize event of the parent hooked, but i cannot find a call to the splitter control that will resize its contents. the second image is what it looks like after dragging from the leaft pane to the right pane.
code in parent resize event:
var
splitter = $find(splitterName);
var pane1 = splitter.get_panes()[0];
splitter._initChildSize(pane1); // tried .layout() and several other methods. i tried debugging into your javascript and cannot see what i need to do
I found that the WebSplitter control has a "DynamicResize" property. I set this property to true, and retested a few scenarios and everything appears to be working.