Функция JQuery Resizable работает только для части селектора

Question

Я пытаюсь использовать JQuery изменяемого размера на оверлей, который находится над столом. Код ниже создает div как абсолютное позиционированное наложение, которое можно изменять и перетаскивать между столбцами.

Код работает нормально. Тем не менее, когда я добавляю "containerment" в качестве опции в функцию jquery ui "resizeable", код работает только в той части таблицы, которая указана как селектор (т. Е. #Grid).

Я добавил JsFiddle http://jsfiddle.net/WUsRx/5/, хотя код для изменяемого размера, похоже, не работает в FsFiddle, но работает для части таблицы #grid в Explorer 8.

Javascript это:

$('#Grid td').click(function(){ 
        var $divName = $(this);
        $('#mainContent').prepend('<div id="test" class="ui-widget-content"></div>');
        var $divOverlay = $('#test');
        var tdPosition = $divName.position();
        offsetTop = tdPosition.top;
        offsetLeft = tdPosition.left;

        var tdWidth = $divName.width();
        var tdHeight = $divName.height();


        $divOverlay.css({
            position: 'absolute',
            top: offsetTop,
            left: offsetLeft,
            width: tdWidth,
            height: tdHeight,
            opacity: '0.8',
            })          

    $('#test').resizable({containment: "#Grid",grid:tdHeight,minWidth:tdWidth, maxWidth:tdWidth}).draggable({ containment: "#Grid", grid: [ tdWidth+2,tdHeight+2] });
    });

Один столбец из HTML включен ниже. Проблема появляется каждый раз и в каждом столбце между #15:30 и #16:00. Сначала я подумал, что это может быть изменение или ошибка в HTML, поэтому использовал PHP для циклического прохождения, чтобы построить таблицу, чтобы обеспечить согласованность каждой строки. После # 16: 00 изменяемый размер кода не работает.

<table id='Grid'>
  <tr id="14:30"><td>14:30</td><td class="wEnd sun" id="sun14:30"></td></tr>
  <tr id="15:00"><td>15:00</td><td class="wEnd sun" id="sun15:00"></td></tr>
  <tr id="15:30"><td>15:30</td><td class="wEnd sun" id="sun15:30"></td></tr>
  <tr id="16:00"><td>16:00</td><td class="wEnd sun" id="sun16:00"></td></tr>
  <tr id="16:30"><td>16:30</td><td class="wEnd sun" id="sun16:30"></td></tr>
</table>

Любые мысли приветствуются.