我正在做一些像演示div这样的思考,并用JQuery给他100%的监视器高度。 在Google Chrome中,一切都很完美,但是mozilla给它的高度值很差。
JQuery的
var active = "uvod";
var menuHM = 100;
function startupMc() {
$(document).ready(function() {
var winHeight = $(window).height();
var winWidth = $(window).width();
var mainHeight = $("#main").height();
$("#main").css({height: winHeight + "px"});
$("#main").children("img").eq(0).css({marginLeft: winWidth / 2 - 250 + "px"});
$("#main").children("img").eq(0).css({marginTop: winHeight / 2 - mainHeight * 2 + "px"});
$("#main").children("img").eq(0).slideDown(1000);
$("#content").css("height", winHeight - menuHM + "px");
});
}
function dale() {
$("#content").show();
$("#uvod").show();
$("#menu").show();
$("#uvod").load("main.php");
$("html, body").clearQueue();
$("html, body").animate({
scrollTop: ($("#content").offset().top)
}, 1000);
$("#main").slideUp(1000);
$("#vip").load("vip.php");
$("#ateam").load("ateam.php");
$("#prava").children("#odstup").load("prava.php");
$("html, body").delay().queue(function(next) { $(this).css({overflowY: "auto"}); next() });
$("#menu").delay(1000).queue(function(next) { $(this).css({position: "fixed"}) });
$("#content").delay(1000).queue(function(next) { $(this).css({marginTop: menuHM}) });
}
function slideDiv(div) {
if(div != active) {
$("html, body").clearQueue();
$("html, body").animate({
scrollTop: ($("#content").offset().top)
}, 1000);
$("#" + active).clearQueue();
$("#" + div).clearQueue();
$("#" + active).hide("slide", { direction: "left" }, 800);
$("#" + div).delay(900).show("slide", { direction: "right" }, 800);
active = div;
}
}
$(window).resize(function() {
var winHeight = $(window).height();
var winWidth = $(window).width();
var mainHeight = $("#main").height();
$("#main").css({height: winHeight + "px"});
$("#main").children("img").eq(0).css({marginLeft: winWidth / 2 - 250 + "px"});
$("#main").children("img").eq(0).css({marginTop: winHeight / 2 - 216 / 2 + "px"});
$("#content").css("height", winHeight - menuHM + "px");
});
HTML
<div id="main" class="mc">
<img src="../images/HellGaming.png" />
<center>
<button onClick="window.location('../');">Zpět</button>
<button id="dale" onClick="dale();">Dále ➯</button>
</center>
</div>
<div id="menu">
<ul>
<li onClick="slideDiv('uvod');"><a>Hlavní stránka</a></li>
<li onClick="slideDiv('vip');"><a>VIP</a></li>
<li onClick="slideDiv('ateam');"><a>ATeam</a></li>
</ul>
</div>
<div id="content">
<div id="leva">
<div id="odstup">
<div id="uvod">
</div>
<div id="vip">
</div>
<div id="ateam">
</div>
</div>
</div>
<div id="prava">
<div id="odstup">
</div>
</div>
</div>
<script>
$(document).ready(function() {
startupMc();
});
</script>
提前感谢您的回复!
答案 0 :(得分:0)
好的,我明白了。
问题出在header.php。
当我们创建html结构时,我们必须编写&lt;!DOCTYPE HTML &gt;
我在doctype中没有'html',所以把它放进去就可以了。
此外,我发现我们无法将html5 放入doctype。
希望有帮助,当遇到同样问题的人找到这篇文章时。
感谢您的回答!