jquery-ui: arrastre desde contenido redimensionable a div de salida

hola, no sé cómo resolver este problema, para cambiar el tamaño de div, uso "desbordamiento: oculto", pero si coloco esto, no puedo arrastrarlo para salir de div (puedo pero es transparente), si lo dejo y cambio el tamaño el div no se esconde:

HTML

    <div class="region">
    dragg to me MADA FAKA
</div>
<div id="tabs">
    <ul>
        <li><a href="#tabs-1">tab-1</a></li>
        <li><a href="#tabs-2">tab-2</a></li>        
        <li><a href="#tabs-3">tab-3</a></li>        
    </ul>
    <div id="tabs-1">
        <div class="destacado" title="destacado">
            DRAGGABLE TO MADAFAKA 1
        </div>
    </div>
    <div id="tabs-2">
        <div class="destacado" title="destacado">
            DRAGGABLE TO MADAFAKA 2
        </div>        
    </div>    
    <div id="tabs-3">
        <div class="destacado" title="destacado">
            DRAGGABLE TO MADAFAKA 3
        </div>        
    </div>    
</div>

CO

#tabs
{
    position: fixed;
    overflow: hidden;
    width: 320px;
    height: 150px;
    padding: 0.5em;
    border: 1px solid black;
    z-index: 2;
}


.destacado
{
    border: 2px solid black;
}

.region
{
    width: 200px;
    height: 200px;
    border: 2px solid red;
}

JS:

$('#tabs').tabs();
$('#tabs').resizable();
$('#tabs').draggable();

$('.region').sortable(
{
    connectWith: '.region',
    items: 'div[title="destacado"]'
});

$('#tabs-1, #tabs-2, #tabs-3').sortable(
{
    connectWith: '.region',    
    items: 'div[title="destacado"]'       
});

jsFiddle sin desbordamiento: oculto: http://jsfiddle.net/hq9Pw/2/

jsFiddle con desbordamiento: oculto: http://jsfiddle.net/hq9Pw/3/

preguntado el 03 de mayo de 12 a las 16:05

1 Respuestas

finalmente resuelto con esto:

    connectWith: '.region',
    appendTo: 'body',
    containment: 'window',
    helper: 'clone'

contestado el 04 de mayo de 12 a las 15:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.