function adjustHeight(){
var headerHeight=$(element).find('.header').outerHeight();
console.log(headerHeight);
var temp=$(window).height()-headerHeight;
console.log(temp);
$('.users').height(temp);
}
最初和调整窗口大小时调用一次
.users 元素的高度总是比控制台临时变量高 30 像素。
$('.users').css('height',temp+'px');
这按预期工作正常。
<div class="mainPage" data-bind="visible:mode() === 'authenticated',handleHeightOfElements:''">
<div class="header">
<div>
This is header text
</div>
</div>
<div class="mainBody">
<div class="users">
All users:
<div data-bind="foreach:userList">
<div class="user">
<span data-bind="text:$data.userName,css:{onlineUser:$data.online()}">
</span>
</div>
</div>
</div>
.users{
float: left;
width: 140px;
background: antiquewhite;
padding: 15px;
box-sizing:border-box;
}
最佳答案
首先:.css("height")
和 .height()
是等价的。
但是你把$('.users').height(temp)
设置为temp
,这是$(window).height( )
减去 ('.header').outerHeight()
.outerHeight()
包括元素的填充、边距和边框。
这不是 .css("height")
或 .height()
的情况。
我打赌你的 30px 偏移来自边距/填充/边框。
它适合您上次编辑 padding: 15px;
for .users
。
编辑
这是您的计算错误图像:
计算中不考虑变暗的部分。
关于javascript - $(element).height 对比 $(element).css ('height' ,value);,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38488379/