How can I prevent my jQuery draggable from fading with its container?

I have a draggable helper ($('#tgt').draggable({helper: 'clone'})) that is visible inside a container that fades out on hoverOut. Unfortunately, once I drag my draggable outside of the container toward the droppable target I lose it. It fades out when 开发者_StackOverflow社区the original container fades out.

How might this be avoided? I tried in the start event to reparent the helper to the body but this causes other oddities. Also overriding the css opacity and such on the draggable helper didn't seem to help.

You can write two callback functions to handle both drag start and drag stop events, and in those functions you can enable/disable the animation behavior of the container.

$('#tgt').draggable({
    helper: 'clone', 
    start: function(event, ui){...},
    stop: function(event, ui){...}
});

Solved. Just needed to call the appendTo option to specify a different parent for the helper.