我的网站需要在每个屏幕上全屏显示。出于这个原因,我使用了很多jQuery来确定高度,最大高度,边距......
我在容器ID上有一个margin-top。当我在脚本末尾调用高度(这是确定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>
任何人都可以帮我处理容器的顶部和高度吗?它在我的屏幕上返回552px,但容器ID的高度为546px
我有example
答案 0 :(得分:2)
使用outerHeight计算元素的高度,包括边框和填充。
$("#element").outerHeight(); // height + padding + border
或者如果你想添加元素的边距
$("#element").outerHeight(true); // height + padding + border + margin
答案 1 :(得分:1)
使用
$("#element").outerHeight();
或
$("#element").innerHeight();
根据您的要求。