以下のような感じで「resizable」を使用して実現できる。
┌──────────────────────────────────────┐
│<div id="all">                                                              │
│  <div id="left">LEFT</div>                                                 │
│  <div id="right">RIGHT</div>                                               │
│</div>                                                                      │
├──────────────────────────────────────┤
│#all {                                                                      │
│    position            :relative;                                          │
│    height              :64px;                                              │
│    width               :640px;                                             │
│    background-color    :#CCCCCC;                                           │
│}                                                                           │
│#left {                                                                     │
│    position            :absolute;                                          │
│    top                 :0;                                                 │
│    height              :100%;                                              │
│    left                :0;                                                 │
│    width               :128px;                                             │
│    background-color    :#FF0000;                                           │
│}                                                                           │
│#right {                                                                    │
│    position            :absolute;                                          │
│    top                 :0;                                                 │
│    height              :100%;                                              │
│    left                :128px;                                             │
│    right               :0;                                                 │
│    background-color    :#0000FF;                                           │
│}                                                                           │
├──────────────────────────────────────┤
│$('#left').resizable({                                                      │
│    handles     :'e',  // 右境のみ                                          │
│    containment :'parent',                                                  │
│    resize      :function(event, ui) {                                      │
│        $('#right').css('left', $(this).css('width'));                      │
│    },                                                                      │
│    stop        :function(event, ui) {                                      │
│        $('#right').css('left', $(this).css('width'));                      │
│    }                                                                       │
│});                                                                         │
└──────────────────────────────────────┘

ドラッグが終わった時点(いわゆるドロップの時点)で、
親要素からの相対座標を表示する。
┌──────────────────────────────────────┐
│<div id="draggable">コンテンツ</div>                                        │
├──────────────────────────────────────┤
│<script>                                                                    │
│$('#draggable').draggable({                                                 │
│    stop    :function(event, ui) {                                          │
│        alert('X:' + $(this).position().left + '\n'                         │
│            + 'Y:' + $(this).position().top);                               │
│    }                                                                       │
│});                                                                         │
│</script>                                                                   │
└──────────────────────────────────────┘
なお、ページからの絶対座標を表示するには、
「position()」を「offset()」に置換すればよい。