Question

I am looking into the jQuery UI Resizable method and I have to DIVs (one next to the other). I want to be able to resize one and change the other accordingly. One DIV gets bigger and the other DIV gets smaller…

$(document).ready(function () {
$("#right").resizable({
    alsoResize: '#left',
});

$("#left").resizable({
    alsoResize: '#right',
});

});

Thanks,
Max

Answer 1

You want to tie into the “resize” event (http://docs.jquery.com/UI/Resizable#event-resize)

  $("#right").resizable({
        resize: function(event, ui) { 
          // look at the size of the ui element being resized 
          // and resize the left accordinly        
        }
  });