jQuery .height() 没有 return 正确的值
jQuery .height() doesn't return the right value
我有一个网站需要在每个屏幕上全屏显示。出于这个原因,我使用了很多 jQuery 来确定高度、最大高度、边距...
我在容器 ID 上有一个 margin-top。当我在脚本末尾调用作为确定边距顶部基础的高度时,它没有给我正确的数量。
只要容器id的高度在var containerh中不对,var containert也不对。
var height = $(window).height();
var width = $(window).width();
var containerw = width * 0.9;
var containerl = containerw * 0.5;
var containerh = $("#container").height();
var containert = containerh * 0.5;
$("#container").css("margin-left", "-" + containerl + "px");
$("#container").css("margin-top", "-" + containert + "px");
alert($("#container").height());
* {
margin: 0;
padding: 0;
overflow: hidden;
}
h1 {
font-family: 'Hobo';
color: #0070c0;
font-weight: lighter;
}
font {
color: #ed27b9;
}
#container {
position: absolute;
top: 46%;
left: 50%;
}
video {
border: 2px solid #134963;
}
<center>
<div id="container">
<center>
<h1>Leur <font>« experience »</font> en quelques mots...</h1>
</center>
<center id="boven">
<video class="video2" frameborder="0" poster="../beelden/image39.png" webkitAllowFullScreen mozallowfullscreen allowFullScreen controls>
<source src="../video/film1.mp4" type="video/mp4">
<source src="../video/film1.ogg" type="video/ogg">
<source src="../video/film1.webm" type="video/webm">
Your browser does not support the video tag
</video>
<video class="video2" frameborder="0" poster="../beelden/image40.png" webkitAllowFullScreen mozallowfullscreen allowFullScreen controls>
<source src="../video/film1.mp4" type="video/mp4">
<source src="../video/film1.ogg" type="video/ogg">
<source src="../video/film1.webm" type="video/webm">
Your browser does not support the video tag
</video>
</center>
谁能帮我解决容器的顶部边距和高度问题?它 returns 在我的屏幕上是 552px,但是容器 id 的高度是 546px
我有什么example
使用
$("#element").outerHeight();
或
$("#element").innerHeight();
根据您的要求。
使用 outerHeight 计算元素的高度,包括边框和填充。
$("#element").outerHeight(); // height + padding + border
或者如果您还想添加元素的边距
$("#element").outerHeight(true); // height + padding + border + margin
我有一个网站需要在每个屏幕上全屏显示。出于这个原因,我使用了很多 jQuery 来确定高度、最大高度、边距...
我在容器 ID 上有一个 margin-top。当我在脚本末尾调用作为确定边距顶部基础的高度时,它没有给我正确的数量。
只要容器id的高度在var containerh中不对,var containert也不对。
var height = $(window).height();
var width = $(window).width();
var containerw = width * 0.9;
var containerl = containerw * 0.5;
var containerh = $("#container").height();
var containert = containerh * 0.5;
$("#container").css("margin-left", "-" + containerl + "px");
$("#container").css("margin-top", "-" + containert + "px");
alert($("#container").height());
* {
margin: 0;
padding: 0;
overflow: hidden;
}
h1 {
font-family: 'Hobo';
color: #0070c0;
font-weight: lighter;
}
font {
color: #ed27b9;
}
#container {
position: absolute;
top: 46%;
left: 50%;
}
video {
border: 2px solid #134963;
}
<center>
<div id="container">
<center>
<h1>Leur <font>« experience »</font> en quelques mots...</h1>
</center>
<center id="boven">
<video class="video2" frameborder="0" poster="../beelden/image39.png" webkitAllowFullScreen mozallowfullscreen allowFullScreen controls>
<source src="../video/film1.mp4" type="video/mp4">
<source src="../video/film1.ogg" type="video/ogg">
<source src="../video/film1.webm" type="video/webm">
Your browser does not support the video tag
</video>
<video class="video2" frameborder="0" poster="../beelden/image40.png" webkitAllowFullScreen mozallowfullscreen allowFullScreen controls>
<source src="../video/film1.mp4" type="video/mp4">
<source src="../video/film1.ogg" type="video/ogg">
<source src="../video/film1.webm" type="video/webm">
Your browser does not support the video tag
</video>
</center>
谁能帮我解决容器的顶部边距和高度问题?它 returns 在我的屏幕上是 552px,但是容器 id 的高度是 546px
我有什么example
使用
$("#element").outerHeight();
或
$("#element").innerHeight();
根据您的要求。
使用 outerHeight 计算元素的高度,包括边框和填充。
$("#element").outerHeight(); // height + padding + border
或者如果您还想添加元素的边距
$("#element").outerHeight(true); // height + padding + border + margin