Draggable and containment in Table

Draggable and containment in Table


Hi,
I am trying to drag an image within the <td> of a table to an element
say <div> outside the table. I am able to drag and drop the item
successfully. The problem is the image is not visible during drag once
the cursor goes out of the table tag. Any idea how to solve this
problem? I tried setting the containment attribute value to 'window'
and used a jquery syntax '#display' to define a broader drag area to
no avail.
<table class="source">
<tr>
<td><img src=''logo.gif"/></td>
</tr>
</table>
<div class="target">
</div>
$('img.source').draggable({
        opacity: 0.7,
        delay: 200,
        helper: 'clone',
        scroll: true,
        start: function(e, ui){
            $(this.parentNode.parentNode).css("opacity", "0.4");
            $(this.parentNode.parentNode).next('tr').css("opacity", "0.4");
            $(this.parentNode.parentNode).next('tr').next('tr').css("opacity",
"0.4");
        },
        stop: function(e, ui){
            $(this.parentNode.parentNode).css("opacity", "1.0");
            $(this.parentNode.parentNode).next('tr').css("opacity", "1.0");
            $(this.parentNode.parentNode).next('tr').next('tr').css("opacity",
"1.0");
        }
    });
Regards,
E.Faisal