jQuery-Ui:不能将对象拖到手风琴之外

我在手风琴小工具里面有一个可拖动的对象。 拖动时,它会约束其父级,即accordion元素。 我试图使用’收容’选项但没有成功。

我用FireFox 3.5.5和Chromium 4试过这个。

有办法解决吗?

谢谢

对于那些寻找完整示例的人,请查看jQuery UI演示中的Shopping Cart示例 。 这是一个可放置的示例,但是说明了所要求的内容(拖动手风琴之外的元素)。

$(function() { $( "#catalog" ).accordion(); $( "#catalog li" ).draggable({ appendTo: "body", helper: "clone" }); }); 

并从那里继续。

我的答案适用于sortables,我认为draggables应该是相似的。 我能够通过使用’clone’而不是默认的’orginal’并使用appendTo:’body’来使其工作。 这很奇怪,因为如果你使用原始作为助手,它似乎不会将助手附加到身体,即使你认为如果你设置appendTo:’body’也应该如此。 我希望你能让它运转起来!

尝试

$(“。selector”)。draggable({appendTo:’body’});

您是否尝试过使用’document’的包含值 :

 $("#draggable1").draggable({ containment: 'document' }); 

这是一个我能够在手风琴外面拖动的例子:

 

Section 1

Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.

Section 2

Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna.

您无法将项目拖动到jQuery手风琴之外,因为对于accordions容器,溢出模式设置为隐藏。

1)您可以尝试将溢出设置为可见(通过内联样式覆盖),但在这种情况下,手风琴本身可能会停止工作。

 

Header 1

...

Header 2

...

Header 3

...