javascript - 如何使用 Javascript 将元素绝对定位到网格布局中？

Question

下面的示例显示了平铺的 div，一旦点击淡出，我一直在尝试扩展它以便删除子 img 而不是 div。

发生这种情况时，div 会丢失任何 CSS 定义的宽度和高度，并且网格会损坏。

有谁知道如何使用不显示并保持网格布局的 JQuery UI 效果仍然为图像设置动画？

http://jsfiddle.net/bzCbh/4/ - 工作示例

谢谢

Answer 1

您的图 block 设置为 display:inline，它忽略了所述元素的高度和宽度。因此，当图像被移除时，它们自然会折叠，高度和宽度从一开始就没有被 div 考虑过。将它们更改为 display:inline-block 即可。

.layer .tile { ... display:inline-block; ...}

您还应该将图像更改为 display:block 以使其行为一致

.layer .tile img { display:block; }

工作 fiddle :http://jsfiddle.net/bzCbh/7/