jQuery可拖动的助手位置

Question

我想在拖动开始时更改可拖动辅助位置的位置，因此网格将计入draggindg元素的新位置。

拖动元素在开始时更改其宽度（开始拖动）并且它不适合网格[100x100]。

start: function (event, ui) {
    ui.helper.css("width", '102px');
}

以下是示例：http://jsfiddle.net/sYHre/73/

正如您在示例中看到的蓝色元素非常适合网格，但红色元素不是。我试图在飞行中改变它的位置，但这不起作用（注释掉代码），对象跳跃，我认为它是jquery ui中的一种bug。也许有更好的方法来做到这一点？

我正在使用最新的jQuery和jQuery UI 1.9.2

Answer 1

一旦开始拖动，元素的宽度就会发生变化，因为它最初属于two类，width: 51px，但是start函数将其更改为ui.helper.css("width", '102px')开始拖动。如果你不想改变它的宽度，那就把它拿出来 - 除了改变那个项目的宽度之外，它没有做任何事情。如果您做希望宽度改变宽度但没有“跳跃”，您可以设置更改动画以使其更加流畅 - ui.helper.animate({width: 102}, 500)似乎工作正常。虽然这有点迷惑，但我建议不要改变宽度，除非有理由我没有这样做。

该对象不适合网格，因为类two要求它位于left: 50%，它不会与您的100 x 100网格完美对齐。如果您希望它与网格对齐，您可以通过将其更改为left: 504px来排队。

另一方面，如果您希望它从left: 50%开始，但是一旦开始拖动，请抓住最近的角落，您想要将snap: '.target'添加到您的选项列表中。这将迫使它捕捉到网格，即使它没有开始与网格对齐。 （事实上​​，如果您愿意，可以设置snapTolerance: 100，在这种情况下您甚至不需要网格 - 可拖动对象将始终捕捉到目标对象。）

Here's an updated fiddle显示snap的使用情况。 This is the same fiddle，但宽度更改已设置动画，因此您可以看到它是如何工作的。

我希望这能回答你的问题。如果没有，请尝试再次解释您想要实现的目标。