jQuery UI 可拖放溢出隐藏

Question

这似乎是一个常见问题，但由于某种原因我根本想不出解决方案。

我正在构建一个需要拖放功能的网站。但是， slider 内有多个元素。显然， slider 内部具有 overflow hidden 和相对定位，以便 slider 可以工作。

这两个属性的组合意味着当从div中拖动图像时，它会被溢出切断。如果没有相对定位，则溢出不会影响拖动的元素。

但是，我非常确定每个 slider /滑动器都会具有相对定位以及隐藏的溢出，因为它们需要它才能正常工作。

但是，有人能想出解决办法吗？

Here's a reduced test case for the site 。我没有包含 slider js，但带有位置/溢出的基本 css 可以显示问题。

对于那些想要检查代码的人，我使用的 slider 是 swipe.js .

从 .items .item 和 .site-wrap 中删除位置将向您展示拖放操作如何与 一起使用>溢出:隐藏。

[编辑]

我注意到，一旦元素开始被拖动，jQuery UI 就会向元素添加一个类。我开始思考是否有一种方法可以捕获它来改变该特定元素的溢出值。但将其更改为 overflow: none 似乎没有做任何事情，问题似乎出在两个父元素上，这当然不能更改，因为用户可以拖/放多个元素。

Answer 1

尝试使用draggable的appendTo调用draggable 时的选项。

$( ".big-item" ).draggable({ 
    snap: ".big-dropzone",
    revert: "invalid", 
    helper: "clone", 
    opacity: 1,
    cursor: "move",
    appendTo: ".big-dropzone"
});

这是一个codepen你的例子的分支