Все свыклись с тем что на javascript можно делать перетаскиваемые объекты (drag-and-drop), но как и ajax, такой приём имеет узкое применение. В моём случае - это разделитель, aka splitter, ruler, divider как вам угодно.

Все их видели в Outlook и десктопных приложениях, многие баловались frameset-ами в девяностых, но потребность в моём случае всё ещё осталась в админ панелях и приложениях, где свободное место должно легко расширяться.

Первым делом я надумал написать скрипт сам, но подумав - решил поискать существующие решения. Сначала попалось готовое решение splitpane на j-log - слишком громоздкое. Конечно неплохо что после передвижения разделителя можно ajax-ом сохранить новое местоположение, что-бы потом открывать в сохранённом варианте. Также радует что за расчётом ширины объект обращается к родительскому элементу.

Дальше отпали модули для yui и extjs, и я плюнув написал сам для двух div-элементов.

Сначала я создал три абсолютных div-элемента:

#panel {position:absolute;height:99%;width:250px;overflow-y: auto;}
#panel_resize{left:250px;width:3px;cursor:e-resize;height:100%;position:absolute;background:white;z-index:7;}
#content{position:absolute;left:253px;right:5px;height:99%;}

Потом, поскольку я уже использую scriptaculous, я сделал разделитель передвигаемым, и после передвижения написал перерасчёт ширины двух панелей. Конечно такое решение не элегантно при трёх и более панелях, где тоже прийдётся использовать вычисление ширины в зависимости от ширины родительского элемента, но на данный момент сгодится.

 new Draggable('panel_resize',{constraint:'horizontal',onEnd:function(){ 
   $('panel').style.width=$('panel_resize').style.left;
   $('content').style.left=$('panel_resize').style.left;
 }});