1

我有几个具有相同类的固定位置 div，距离窗口左边缘的距离不同，我想在发生某个动作时在每个 div 上增加/减少该距离等量（在这种情况下，窗口正在调整大小）。我尝试使用 CSS 和百分比而不是像素来定位它们，但它并没有完全完成这项工作。

有没有办法将每个 div 的位置存储在一个数组中，然后添加/减去给定数量的像素？

到目前为止，这是我尝试过的方法-我仍然对 JS 有所了解，所以就我所知，这可能真的很糟糕，但是这里有：

roomObjects = $('.object-pos');

var objectCount = 0;

for ( var objectCount = 0; objectCount < 10; objectCount++;) {
          roomObjects = rooomObjects[objectCount];
          console.log(roomObjects.css("background-position").split(" "));
        }
4

3 回答 3

0

您可能会面临的一个问题是，在检索当前的 le​​ft 或 top 属性时，它们以字符串形式返回，末尾带有pxof %。尝试parseInt()对返回的值运行 a 以获取一个数字，然后您很可能能够添加到这些值中。请确保在重新分配时，您在末尾酌情连接“px”或“%”。

于 2012-05-14T16:42:35.410 回答
0

你介意分享为什么百分比不起作用吗？如果您希望页面在窗口调整大小时正确缩放，通常这就是我的建议。我想如果你真的想要你可以做这样的事情：

$(window).resize(function() { 
    $('#whateverdiv').style.whateverproperty = $('#whateverdiv').style.whateverproperty.toString() + (newPosition - oldPosition);
    oldPosition = newPosition;
}

这显然不是完整的代码，但你应该能够填补空白。您必须在页面加载时使用原始位置设置 oldPosition 变量，以便该函数第一次工作。

编辑：您还必须从 x.style.property 字符串中删除单位，以便您能够将值添加到它

于 2012-05-14T16:51:21.817 回答
0

你可以使用一点 jQuery ：

var el = $("#id");
var top = el.css("top");
el.css("top", top * 1.2); // increase top by 20%

节省 DOM 中的乱七八糟

如果您想相对定位事物，这可能很有用：http: //docs.jquery.com/UI/Position

于 2012-05-14T17:00:21.170 回答