如何使用javascript设置div以匹配浏览器窗口高度?
我正在尝试让脚本正常工作,但有点困难。
我需要创建一个在页面加载时显示的 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 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
你想要 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.