可拖动和溢出问题

小开

附件

元素，选择器默认值: “父”

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

代码示例使用指定的阑尾选项初始化一个可拖动的。

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

小开

最佳答案

注意文档当然是值得的

卷轴

输入: Boolean
默认值: true
如果设置为 true，则容器在拖动时自动滚动。

所有进入这里的人，从我的错误中吸取教训，RT (F) M! ! ！

小开

设置滚动选项不会阻止子级隐藏在溢出区域中。我想出了一个使用 helper 选项的 work-a-round。看看这个:

这里还提到了我的另一篇文章:

小开

我在两个溢出自动 div 之间启用拖动时遇到了类似的问题。在前面答案的帮助下，我发现这个组合适合我(Safari 5.0.3，jquery-1.4.4，jquery-ui-1.8.7) :

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

小开

克隆解决方案可行，但有两个问题。

第一: 克隆体附着在身体上。根据您的 css，您的元素可以更改样式，因为在它开始之前，它在另一个元素的内部，在拖动过程中，它将直接在 body 元素上。

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

因此，解决这个问题的方法是:

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

小开

还可以指定不希望包含的元素类型。

<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'});