jQuery UI and Splitter

Question

Using jQuery UI, how can I use a Splitter kind of feature like the one at http://methvin.com/splitter/3csplitter.html?

I am asking this as I need 2 things to be impleme

Answer 1

I used Dmitriy's answer as the base of my implementation. Note that there is nothing stopping that particular implementation from doubling the bounding box when the slider is dragged to the right.

I needed a simple non-moveable splitter for now (with the view to making the panes resizable in the future), and my application is already using jQuery, so I achieved this by changing part of his code as follows:

$(function () 
{
    $(".resizable1").resizable(
    {
        autoHide: false,
        containment: "#wrap",
        ...

I also changed the css cursor style (among other things) to prevent the resizable cursor from being displayed as follows:

.ui-resizable-e { 
    cursor: default; 
    ...

Thanks Dmitriy!