Question

function pageSize(what){
    oldHeight = parseInt(document.getElementById('items').style.height);
    if(what == 'bigger') {newHeight = oldHeight + 100};
    if(what == 'smaller'){newHeight = oldHeight - 100};
    document.getElementById('items').style.height = newHeight + 'px';
}

上面，我把javascript代码应该做的诀窍......这就是de div：

<div id="items" style="height: 100%;"></div>

我用

做大或小

<a href="#" onclick="pageSize('bigger')"><img src="img/contentbigger.png" /> Page bigger</a> &nbsp; <a href="#" onclick="pageSize('smaller')"><img src="img/contentsmaller.png" /> Pagina smaller</a>

但是这个代码在最新的Mozilla Firefox和最新的Internet Explorer中都没有任何作用。

有人看到这里有什么问题吗？因为我对javascript并不是那么好......

Answer 1

我猜parseInt()应用于<numeric>px或<numeric>%这样的字符串会产生虚假的返回值。您应该省略将px附加到您的身高以使其正常工作。

Answer 2

使用element.offsetHeight而不是element.style.height。 OffsetHeight也是一个数字，所以不需要parseInt。

Answer 3

确保在获取px后摆脱em或oldHeight字符串：

function pageSize(what) {
  oldHeight = document.getElementById('items').style.height.replace('px','').replace('em','');
  oldHeight = parseInt(oldHeight);
  if(what == 'bigger') {newHeight = oldHeight + 100};
  if(what == 'smaller'){newHeight = oldHeight - 100};
  document.getElementById('items').style.height = newHeight + 'px';
}

Answer 4

将唯一ID应用于两个DIV。我们说“左”和“右”。所以代码将是这样的：

<script>
function height() 
{
    var right = document.getElementById('right').clientHeight;
    var left = document.getElementById('left').clientHeight;

    if(right > left)
    {
        document.getElementById('left').style.height = right;
    }
    else
    {
        document.getElementById('right').style.height = left;
    }
}
</script>

然后只需在页面加载

上触发该功能

<body onload="height()">

这应该可以解决问题。

动态更改div高度

4 个答案: