Question

在我的网站上，我有一个包含大量元素的div。元素按坐标位于px而不是％。

div的高度= 1000px，宽度= 1000px;

单击按钮

我将Div的大小调整为500px X 500px;

有没有办法我可以调整其中的所有元素，而不必仔细检查每个元素，并弄清楚每个元素的新大小和位置应该是什么？而且我还需要在不使用百分比的情况下完成它。

我只是想问这是否可行，或者正在寻找提示或提示。

由于

Answer 1

听起来你应该使用相对测量开始：）

以下是一些关于如何使用jQuery执行此“丑陋方式”的示例代码：

$('#container div') // your selector here
    .each(function () {
        var t = $(this);
        var p = t.position();
        t.css({
            left: ~~(p.left * .5),      // ~~ is for flooring
            top: ~~(p.top * .5),        // you could do x / 2 instead of * .5
            height: ~~(t.height() * .5),
            width: ~~(t.width() * .5)
        });
    });

另一种方法可能是使用容器的CSS选择器来说明其内部div的一些替代测量和坐标。这是一个例子：

#container { ... }
#container div { position: absolute; }
#container .myDiv1 { left: 40px; top: 40px; height: 100px; width: 100px; }
#container:hover .myDiv1 { left: 20px; top: 20px; height: 50px; width: 50px; }

调整大小并定位DIV中的所有元素以匹配新尺寸

1 个答案: