Сменные элементы путем перетаскивания (jQuery)

Question

У меня есть 4 квадрата, представленных как эскиз внизу. (или притворяться, что есть только 4 квадрата в this puzzle demo.) Я хочу поменять местами два, по горизонтали, по вертикали или по диагонали без, влияющих на два других. В демо-головоломке, если вы меняете по две диагонали, например, 1 & 4, некоторые смежные квадраты тоже перемещаются, что нежелательно.

Я был в состоянии сделать обмен, используя jQuery's draggable & dropabble. Я делаю своп в событии drop of droppable. Однако нежелательный визуальный эффект заключается в том, что когда я отбрасываю квадрат, он возвращается, а затем происходит переход. Я не хочу, чтобы возвращение произошло. This post имеет большую часть моего кода.

Любые идеи о том, как остановить возвращение от использования или как использовать одну и ту же демо-версию, но иметь только два квадрата, до & от, своп без перемещения других квадратов? (Не уверен, что это возможно с помощью JQuery sortables)

1 2 
3 4 

Answer 1

This swap animation plugin для JQuery может решить вашу проблему красиво.