javascript - 设置相对于 `window.innerHeight` 的高度不起作用

标签 javascript html css

对于某些人来说,这可能是一个非常愚蠢的问题,但我肯定无法理解这背后的问题。代码相当简单,如下所示:

HTML:

<!DOCTYPE html>
<html lang="en-US">
    <head>
        <title>####</title>
        <meta charset="UTF-8">
        <link rel="stylesheet" type="text/css" href="css.css">
    </head>
    <body onload="resizeDiv();">    
        <div id="testElement">ABCD</div>
        <div id="secElement">ABC</div>
        <script type="text/javascript" src="javascript.js"></script>
    </body>
</html>

CSS:

html , body{
    height:100%;
}
#testElement{
    background-color:black;
    color:white;
}
#secElement{
    font-size:50px;
}

JS:

(function immediate(){
    document.getElementById('secElement').textContent = window.innerHeight;
}());
function resizeDiv(){
    document.getElementById('testElement').style.height = (window.innerHeight - 50) * 0.9;
}

现在,通过这段代码,divid 'testElement' 的高度应为 window.innerHeight - 20 的 90% .但是,似乎没有任何效果。请帮忙。

最佳答案

添加“px”:

document.getElementById('testElement').style.height =  (window.innerHeight - 50) * 0.9 + "px";

关于javascript - 设置相对于 `window.innerHeight` 的高度不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33454073/

相关文章:

javascript - Firefox 中 D3 强制布局性能缓慢

html - 输入的值来自文件

javascript - 我是否应该将 _TrackPageview 代码段添加到 <a> 标记或单击链接时触发的 JavaScript 容器中的某个位置?

javascript - 通过 javascript 单击按钮时不会转到其他页面

html - CSS DIVS 和自动高度

javascript - element.stylet 中生成的 Css 影响我的网页,我无法覆盖

javascript - 绝对位置过渡

javascript - 为什么 IF else google app 脚本公式不能产生正确的值?

css - wordpress 中的组合 CSS 声明

javascript - 当页面的一部分被溢出 CSS 隐藏时,如何将图像置于浏览器中心?