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

My first thought was: first you select all the boxes except the last. Those get a splitter to their right side. Then, when the splitter is moved, only the two boxes touching the splitter are resized.

This is an example you can copy paste; it works as is. This can be used for any number of columns; just make sure you also adapt the css.

I added some buttons to expand 1 box; also a reset button.

 

  
    
    
    
    
  
  
    

      
 HELLO  
      
 WORLD 
      
 FOO 
      
 BAR