0

我有一个主要的相对 DIV。在那个 div 里面，我有一些带有图像的绝对 div。下面的部分代码示例：

   <div  id="loopdiv" style="position:absolute; left:0px; top:0px; width:2000px; height:1333px;">
        <div style="position:absolute; left:0px; top:0px; width:2000px; height:25px;">
            <img id="index_01" src="image3/index_01.jpg" width="2000" height="25" alt="" />
        </div>
        <div style="position:absolute; left:0px; top:25px; width:102px; height:1308px;">
            <img id="index_02" src="image3/index_02.jpg" width="102" height="1308" alt="" />
        </div>
....
...

我想用javascript改变那些相对div的位置。这是我的 javascipt 代码：

var divs = new Array();
var loopdiv = document.getElementById('loopdiv');
divs =loopdiv.getElementsByTagName('div'); 

for (var i=0;i<divs.length;i++){ 
divs[i].style.position ="absolute";
divs[i].style.left=0;
divs[i].style.top=0;
alert(divs[i].style.left+"||"+i);
alert(divs[i].style.right+"||"+i);

奇怪的是javascript中的值0有效。所有 div 都转到 0,0 位置。但是，如果我尝试将值设置为另一个数字。例如：

divs[i].style.left=300;
    divs[i].style.top=300;

现在 div 保持在 HTML 中的位置。他们不会达到 300 或我输入的任何其他数字。只有 0。

有谁知道为什么？

4

1 回答 1

1

您没有定义单位标识符。

在您原来的情况下，您将位置归零，您实际上是在做：

divs[i].style.left=0===divs[i].style.left='0px';

...所以要让您的示例使用像素，请使用px：

divs[i].style.left = 300;-->divs[i].style.left = '300px' ;

更新

要确定我的答案，请查看 CSS 值和单位规范：http ://www.w3.org/TR/REC-CSS1/ 。请注意它是如何说单位标识符仅在值为 0 时是可选的。

长度值的格式是一个可选的符号字符（'+' 或'-'，'+' 是默认值）紧跟一个数字（带或不带小数点），紧跟一个单位标识符（两个-字母缩写）。在“0”数字之后，单元标识符是可选的。

于 2013-04-27T16:56:53.753 回答