jquery ui droppable: как да пуснете елемент извън div с преливане: скрит? - javascript, jquery, css, jquery-ui, jquery-ui-droppable

Знам как да използвам jquery ui droppable.

Но аз не съм sur, ако е възможно да направите това:

вижте на живо пример с тази скрипка

Имам списък на елемент в div, който е в overflow: hidden:

html:

<div id="list">
<p id="draggable_1">Element 1</p>
<p id="draggable_2">Element 2</p>
<p id="draggable_3">Element 3</p>
</div>

css:

#list
{
overflow:hidden;
}

javascript / jQuery:

$("#draggable_1").draggable();
$titre_track_1.droppable({
drop: function () {
alert("dropped");
}
});

Ако се опитам да изпусна елемент като draggable_1 извън div #list, елементът не се вижда. Това е логика, защото родителят е в overflow: скрит

знаете ли дали е възможно да пуснете този елемент отвън? Трябва да имам този div с overflow: скрит

Отговори:

Можете да използвате помощник за клониране, за да клонирате елемент при стартиране на плъзгане и да го прикачите към тялото appendTo опция:

$("#draggable_1").draggable({
helper: "clone",
appendTo: "body",
start: function(e){
$(this).css("visibility", "hidden");
},
stop: function(){
$(this).css("visibility", "visible");
}
});

http://jsfiddle.net/xYQ9c/