jQuery的Draggable和溢出问题

当我从被设置为overflow：scroll的容器div中拖动div时，我遇到了不希望的效果。

我find了一个他们有问题的例子，但是我一直没有find解决办法

粘贴bin的例子

会发生什么是滚动只是增加，我可以看到为什么这将是所需的行为，如果你想拖动滚动div的目的地，但我想能够把它的滚动把握之外。

我有一个类似的问题，使两个溢出自动div之间拖动。在以前的答案的帮助下，我发现这个组合适合我（Safari 5.0.3，jquery-1.4.4，jquery-ui-1.8.7）：

appendTo: 'body', containment: 'window', scroll: false, helper: 'clone'

appendTo

元素，select器默认：“父”

传递给或由appendTo选项select的元素将在拖动期间用作可拖动的助手的容器。默认情况下，该助手被附加到与可拖动相同的容器中。

代码示例使用指定的appendTo选项初始化可拖动。

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

注意文档当然是值得的

滚动

types：布尔值
默认值： true
如果设置为true ，则容器在拖动时自动滚动。

所有进入这里的人，从我的错误中学习，RT（F）M !!!

它的工作克隆解决scheme，但有两个问题。

首先：克隆被附加到正文。根据你的CSS，你的元素可以改变样式，因为在它开始之前，它是在另一个元素的内部，在拖动过程中，它将直接在body元素上。

第二：有时元素必须移动，克隆让对象在那里。

所以，解决这个问题的方法是：

 $('.selector').draggable({ helper: 'clone', start: function(){ $(this).hide(); }, stop: function(){ $(this).show() } });

设置滚动选项不会阻止子项隐藏在溢出区域中。我已经想出了一个使用帮手选项的工作。一探究竟：

另外这里是对我做的另一篇文章的参考：

jquery ui可拖动的元素不是可拖动的滚动div之外的元素

你也可以指定你不想包含哪些types的元素。

 <div class="draggable"> <h2>This will drag the div</h2> <ul> <li>This won't drag the div</li> </ul> </div>

应用此取消属性来忽略指定的子元素中的事件

 $('.draggable').draggable({cancel : 'ul'});