Question

我有一组元素位于另一个设置溢出的元素中的'conveyor'元素上：使用css隐藏。拖动时，如何将溢出设置为隐藏的holder元素的元素“out”？当我拖动“item”分类图像时，它只会在支架内拖动，当我试图将它移到支架“外面”时，它会隐藏，并且不会移动到旧支架元件之外。

<div class="holder" style="overflow:hidden;">
     <div class="conveyor">
          <img src="image1.jpg" class="item" />
          <img src="image2.jpg" class="item" />
          <img src="image3.jpg" class="item" />
     </div>
</div>

<script>

     $('.item').draggable();

</script>

我还试图将新移动的元素追加到父元素，但是该项目不会恢复到我的持有者....请帮忙！

尝试附加项目：

$('.item').draggable(
     helper:'clone';
     revert:'invalid',
     start:function(){
          $(this).parent().parent().append(this);
     }
)

Answer 1

在这里找到答案 - ＆gt; http://docs.jquery.com/UI/Draggable。 Yeesh ......那是几个小时的挖掘！

传递给appendTo选项或由appendTo选项选择的元素将在拖动过程中用作可拖动助手的容器。默认情况下，帮助程序将附加到与可拖动的相同的容器中。

$('.selector').draggable({ appendTo: 'body' });

感谢您的帮助！

Answer 2

首先，感谢大卫。在我的情况下，我不得不添加另一个选项：

// Drag and Drop
$('.draggable').draggable({ 
    revert: true,
    appendTo: 'body',
    helper: 'clone'
});

Answer 3

这些中的任何一个都能得到你想要的吗？

$('.item').draggable( {containment: 'window'} );

$('.item').draggable( {containment: 'document'} );

Jquery UI - 从显示中获取一个元素：拖动时隐藏元素

3 个答案: