我有许多div
s 分布在行和列中(使用 jQuery 生成)。这些div
s 中的每一个都是可调整大小的,使用 JQuery UI Resizable。为了定义需求,所有div
的s都必须使用绝对定位。因此,当我重新调整这些 div 的大小时,脚本应该更新其top
下方所有 div 的属性(位于当前调整大小的 div 之后的同一列和一行)。
这是我现在的代码:
updatePositions: function() {
var update = 0;
$(".element").resizable({
handles: 's',
start: function(event, ui) {
event.stopPropagation();
var el = $(this);
var el_row = parseInt(el.attr("row"));
var el_rel = parseInt(el.attr("rel"));
var el_col = parseInt(el.attr("col"));
update = $(".element").filter(function() {
return(
$(this).attr("row") > el_row &&
$(this).attr("col") == el_col &&
$(this).attr("rel") != el_rel
);
});
},
resize: function(event, ui) {
update.each(function(event){
var top = $(this).position().top + $(this).height() + 20;
$(this).css("top", top )
});
}
})
}
这是一个例子:JSFiddle
如您所见,所有 div 都找到了,我可以更新顶部位置。但是由于某种原因,它在调整大小时变得疯狂!好像我在每个选定的 div 上找到的磁贴一样多次进行更新。