我在项目中使用 jQuery UI Draggable。我有一个复选框，用于切换可拖动对象上的网格(10x10 网格)选项。
但是，当重新打开网格时，网格关闭时移动的对象不会与网格关闭时未移动的对象对齐。简而言之，对象位于不对齐的单独网格上。
所以我想让对象捕捉到 10 的增量(当用户拖动它们时，而不仅仅是在释放时捕捉)，这样当网格打开时对象总是对齐，但我不能似乎不知道如何在 jQuery UI 中实现它。有什么想法吗？
最佳答案
<!DOCTYPE html>
<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<style type="text/css">
#draggable { width: 100px; height: 70px; background: silver; }
</style>
<script>
$(document).ready(function() {
// $("#draggable").draggable({ grid: [10, 10] });
$("#draggable").draggable();
$("#draggable").draggable({
stop: function(event, ui) {
var left = ui.position.left;
var top = ui.position.top;
left = left - left % 10;
top = top - top % 10;
$("#draggable").offset({left:left,top:top});
console.log($("#draggable").position());
}
});
});
</script>
</head>
<body style="font-size:62.5%;">
<div id="draggable">Drag me</div>
</body>
关于javascript - jQuery 可拖动自定义对齐网格，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11094376/