Separates two divs with a draggable divider that you can use to resize the divs, kind of like a frame but without using frames! The two divs should be siblings, that is they should both have the same parent. You can have an arbitrary number of such siblings separated using different instances of this class, i.e. you can have any number of columns separated by a draggable divider that alows you to resize them at will.
You can ask to be notified when the following events occur
This allows you to perform any housekeepng not already performed for you.
You can disable the resizing.
You can ask an instance to serialize itself as an HTTP POST argument list, this is useful in combination with onEnd hooking to save the current div sizes on the server.
In IE all parent divs must have a height other than ‘auto’. div1 and div2 should probably have overflow=hidden set.
| SplitPane | Separates two divs with a draggable divider that you can use to resize the divs, kind of like a frame but without using frames! |
| Properties | |
| SplitPane. cache | Holds all instances of SplitPane. |
| Functions | |
| intialize | |
| set | create a divider. |
| serialize | serialize the splitpane in a form suitable to be used in an HTTP request. |
| dispose | unhook from events |
Holds all instances of SplitPane. Used to delay intialization until Window.onLoad().
| div1_id | a div, or the ID of a div notionally on the ‘left’ of the divider. |
| div1_width | the initial width of div1 as a percentage of its parent’s width |
| div2_id | a div, or the ID of a div notionally on the ‘right’ of the divider. |
| div2_left | the coordinate of the left edge of div2 relative to the parent div as a percentage. |
| div2_width | the initial width of div2 as a percentage of its parent’s width. |
| options | an associative array of optional arguments which include |
| onStart | a function to be called when a drag of the divider starts. |
| onDrag | a function to be called when a drag occurs. |
| onEnd | a function to call when a drag ends. |
| active | if true then resizing can occur. If false then the two divs are set to the specified widths and that is that. Defaults to false. |
serialize: function()
serialize the splitpane in a form suitable to be used in an HTTP request.
| div1 | the id of div1 |
| div1_left | the left edge of div1 expressed as a percentage of the parent width |
| div1_width | the width of div1 expressed as a percentage of the parent width |
| div2 | the id of div2 |
| div1_left | the left edge of div2 expressed as a percentage of the parent width |
| div1_width | the width of div2 expressed as a percentage of the parent width |
create a divider.
set: function()
serialize the splitpane in a form suitable to be used in an HTTP request.
serialize: function()
unhook from events
dispose: function()