将变量传递到jQuery CSS值以计算高度 [英] Pass variable into jQuery CSS value to calculate height
本文介绍了将变量传递到jQuery CSS值以计算高度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我非常需要将此DIV的两个"高度设置为100%-(减)另一个DIV高度(div一个").问题是,另一个DIV(div"one")的高度已经是动态的.
I desprately need to set this DIV "two" height to be calculated as 100% - (minus) another DIV height (div "one"). The thing is, the height of that another DIV (div "one") is dynamic already.
所以:
<body>
<div id="one"></div>
<div id="two"></div>
</body>
div { position: relative; }
body { height: 100vh; }
我尝试了类似的方法,但这不起作用:
I tried things like these, but that doesn't work:
$(document).ready(exe);
$(window).resize(exe);
function exe(){
var topHeight = $('#one').outerHeight(true);
$('#two').css("height", "calc(100% - topHeight)")
}
或
$(document).ready(exe);
$(window).resize(exe);
function exe(){
var topHeight = $('#one').outerHeight(true);
var topHeightCalc = '100%' - topHeight;
$('#two').css("height", topHeightCalc)
}
推荐答案
朋友,您也可以不用使用calc()函数就可以实现所需的功能.
Hey friend you can also achieve what you want without using the calc() function.
这将获取窗口的高度并从中扣除div #one
的高度,并将该高度应用于div #two
.
This gets height of the window and deduct height of the div #one
from that and apply that height to div #two
.
$(document).ready(exe);
$(window).resize(exe);
function exe(){
var topHeight = $('#one').outerHeight(true);
var vhHeight = $(window).outerHeight(true);
$('#two').css("height", vhHeight - topHeight + "px");
}
这篇关于将变量传递到jQuery CSS值以计算高度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文