精灵的位置z-index

我已经绝对定位了在1000px x 1000px范围内移动的对象/精灵。我希望这些精灵有相对于它们的位置的z索引： - 向左越靠z-索引越高。 - 进一步向下Z指数越高（也包括对象的高度）。因此，该区域左下角的物体比右上角的物体具有更高的z-index - 当物体相互靠近时应该会产生一种很酷的幻觉。精灵的位置z-index

伊夫试过，但它未能：

object.style.zIndex = (1000 - parseInt(object.style.left)) + 
         parseInt(object.style.top) + object.clientHeight

来源

2011-05-26 Johnny Darvall

在算法：

阅读的阵列内的所有子画面;
迭代所有数组对象，读取每个对象的左边位置属性，存放在同一个数组中;
按值数值排列数组（即left position属性）;
迭代所有arrayy对象，按数组项索引设置z-index。

使用jQuery将缩短此代码。如果你给我们你的精灵的示例代码和地区，我们可以尝试eaven创建一些JS代码，即“做工作” ......

来源

2011-05-26 14:15:13 Deele

感谢这个提议 - 但我不希望使用这项事业的阵列做它在使用setInterval（飞？ 100） – 2011-05-28 11:42:16

哦 - 而且我已经构建了没有jQuery的整个机制。现在即时通讯打字这一点，我实际上迭代通过所有移动的元素和存储他们的价值 - 我将使用上面提出的代码，并存储价值 - 生病答复结果尽快... – 2011-05-28 11:47:36

这是很容易做到用数学

时做到这一点永远的精灵移动，从而将其添加到方法或函数多数民众赞成移动它们

spritePos = { 
      'x':1000 - parseInt(object.style.top.replace("px")), 
      'y':parseInt(object.style.left.replace("px")) - 1000 
}; 

zIndex = spritePos.x + spritePos.y; 
object.style.zIndex = zIndex;

来源

2011-05-26 14:16:02 Barkermn01

这看起来很有前途 - 虐待测试和答复尽快。 ..谢谢 – 2011-05-28 11:43:27

好的尝试了你的代码，但它仍然没有工作 - 但它确实表现当我改变它为：返回（（parseInt（o.style.top）+ o.clientHeight）* 100）+（parseInt（o .style.left）-8000） – 2011-06-02 20:14:34

精灵的位置z-index

回答

相关问题