jquery - コンテンツが変更されると Jquery UI Resizable が機能しない

Question

次のjqueryコードがあります。ボタンが最初にクリックされたときは正常に機能します。ボタンをもう一度クリックすると、サイズ変更機能を除いてすべてが機能します。

    $('#setposition').live('click', function(){
            $('#positionbox').height(parseInt($('#height').val()) + 105);
            $('#positionbox').width(parseInt($('#width').val()) + 5);
            $('#poscontainer').height($('#height').val());
            $('#poscontainer').width($('#width').val());
            $('#poscontainer').css('background-image',         "url('"+$('#image').attr('value')+"')");
            $('#poscontent').html($('#content').val());
            $('#poscontent').draggable({containment:"parent"}).resizable(
            {
                handles: "all",
                stop: function(event, ui) {
                    var p = $('#poscontent').position();
                    $('#position').val(ui.size.width + ',' + ui.size.height + ',' +
                        p.left + ',' + p.top);
                      }
                  }
                );
            $('#poscontent').hover(function(){
                $(this).css('border','1px solid #000')
                    },function(){
                $(this).css('border','none')
            });
    });

重要な HTML 要素:

    <a id="setposition" class="btn btn-success" data-toggle="modal" href="#positionbox">Set Position</a>
    <input type="hidden" name="position" id="position">

    <div id="positionbox" class="modal hide fade in" style="display: none;">
    <div class="modal-header">
       <h3>Drag your content to the appropriate position</h3>
    </div>
    <div id="poscontainer">
       <div id="poscontent">test</div>
    </div>
    <div class="modal-footer">
         <a href="#" id="imageback" class="btn" data-dismiss="modal">Back</a>
    </div>
    </div>

解決策を見つけました！ 内容を変更した後、Jquery UIでdivのサイズを変更する方法は?