Похоже, что опция 'сетки' в конструкторе Перемещаемых относительно связывается с исходными координатами перетаскиваемого элемента - так проще говоря, если у Вас есть три перемещаемых отделения с их главным набором соответственно к 100, 200, 254 пикселя относительно их родителя:
Adn все они становятся включенными для перетаскивания с набором 'сетки' к [1, 100]:
draggables = $('.draggable');
$.each(draggables, function(index, elem) {
$(elem).draggable({
containment: $('#parent-div'),
opacity: 0.7,
revert: 'invalid',
revertDuration: 300,
grid: [1, 100],
refreshPositions: true
});
});
Проблема здесь состоит в том, что, как только Вы перетаскиваете div3, скажем, вниз, это - вершина, увеличен на 100, переместив его в 354 пкс вместо того, чтобы быть увеличенным на просто всего лишь 46 пкс (254 + 46 = 300), который получил бы его к следующей остановке в сетке - 300 пкс, если мы смотрим на родительское отделение как на ориентир и "держателя сетки".
Я взглянул на перемещаемые источники, и это, кажется, встроенный дефект - они просто делают все вычисления относительно исходного положения перемещаемого элемента.
Я хотел бы избежать исправления обезьяны код перемещаемой библиотеки и что я действительно ищу, вот путь, как заставить Перемещаемое вычислить положения сетки относительно содержания родителя. Однако, если исправление обезьяны неизбежно, я предполагаю, что должен буду жить с ним.
Я решил эту проблему, просто добавив свой собственный скрипт для drag: under draggable и настроив его на деление math.Floor (x / 100) * 100 и то же самое для Y.
Если вы не против ткнуть в исходном коде посмотрите http://labs.pezcuckow.com/solveit/game.html и функцию make draggable! (игра еще не закончена)
вы также обнаружите проблему с откатом, он не возвращает их обратно привязанными к сетке. Итак, я написал свою собственную функцию "проверить, не является ли недействительной" в конце: of dragabble (снова ее можно просмотреть в игре выше).