动态改变对象的大小而不影响其他元素答案

【问题标题】：Dynamically change size of objects without affecting other elements动态改变对象的大小而不影响其他元素
【发布时间】：2012-06-06 10:55:53
【问题描述】：

我知道标题可能有点令人困惑（我不知道该怎么问这个问题）所以这是我正在处理的示例。

所以我的问题是，当您将鼠标悬停在图像上时，其他图像会在图像放大时四处移动。一种可能的解决方案是使用绝对定位，但在网格中手动定位所有图像非常麻烦（我希望将其设为 3 列宽的网格）。

还有哪些其他解决方案可以帮助解决这个问题？我对纯 javascript 解决方案以及使用 JS 库都持开放态度。

CSS：

#gallery {
    display:inline;
    margin:50px;
    height:300px;
}

#gallery img {
    position:relative;
    width:200px;
    margin:30px;
}

【问题讨论】：

【解决方案1】：

是否考虑过使用 javascript 框架，例如 jQuery？

滚动到缩放效果，您将看到您要查找的内容。

【讨论】：

虽然这是我正在寻找的，但我更希望它是免费和开源的。不过谢谢你的建议。我还将更仔细地浏览 jQuery 库以查找可能适合我情况的内容。如果有其他解决方案，请继续发帖。

【解决方案2】：

简单。给每张图片一个不同的z-index！这样他们都在不同的平面上......

您可以使用 JavaScript/DHTML 方法来做到这一点。如果您在数组中对图像进行编号，则可以很容易地循环遍历图像并为每个图像分配一个递增的 z-index。

【讨论】：