如何使用javascript设置div以匹配浏览器窗口高度?

发布于 2024-12-21 21:13:03 字数 816 浏览 3 评论 0原文

我正在尝试让脚本正常工作,但有点困难。

我需要创建一个在页面加载时显示的 div,并且该 div 下面的任何内容都会被推离页面底部,您需要向下滚动才能查看它。

这是我所拥有的,但它不起作用(我包含了警报,以便我可以检查脚本的第一部分是否正常工作)

<script type="text/javascript">
function getDocHeight() {
var D = document;
return Math.max(
    Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
    Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
    Math.max(D.body.clientHeight, D.documentElement.clientHeight)
);
}
var docheight = ( getDocHeight() ) +'px';
// alert( docheight );
document.getElementById('pusher').style.height = docheight;
</script>

<div id="pusher">This content is shown on the page</div>
<p>Anything here is below the fold of the page and you will need to scroll down to see me</p>

任何帮助将不胜感激。 :-)

I am trying to get a script to work but am struggling a bit.

I need to create a div that is displayed when the page loads and anything below that div is pushed off of the bottom of the page and you would need to scroll down to view it.

Here is what I have but it isn't working (I included the alert so that I could check that the first part of the script was working o.k.)

<script type="text/javascript">
function getDocHeight() {
var D = document;
return Math.max(
    Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
    Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
    Math.max(D.body.clientHeight, D.documentElement.clientHeight)
);
}
var docheight = ( getDocHeight() ) +'px';
// alert( docheight );
document.getElementById('pusher').style.height = docheight;
</script>

<div id="pusher">This content is shown on the page</div>
<p>Anything here is below the fold of the page and you will need to scroll down to see me</p>

Any help would be most gratefully received.
:-)

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

撩起发的微风 2024-12-28 21:13:03

你想要 docheight = window.innerHeight || document.documentElement.clientHeight;

编辑:尽管如此,请记住人们可以调整窗口大小,因此除非您监视 window.onresize,否则请小心。

You want docheight = window.innerHeight || document.documentElement.clientHeight;

EDIT: Although, bear in mind people can resize their windows, so unless you monitor window.onresize, be careful.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文