关于document.body.clientHeight返回值为0的完美解决方案
发布时间：2024-05-16 15:25:08 作者：Duawieh 
我要评论
我要评论这篇文章主要介绍了关于document.body.clientHeight返回值为0的完美解决方案，本文给大家介绍的非常详细，感兴趣的朋友跟随小编一起看看吧
关于body.clientHeight
这里引用一下@kelly0721的博客中的图片，为各位展示一下我们可以获取的各种屏幕元素尺寸。
此处我们希望获得的 document.body.clientHeight 正是浏览器页面可见区域的高度。
解决方案
网上关于此问题的其中一种解决方案是使用HTML4，但是如果我们希望在保持HTML5版本不变的前提下解决此问题呢？
实际上非常简单
<body style="position: absolute; height: 100%;"> ... </body>
只需要为 <body></body> 标签添加上文所述样式即可，添加样式的方式不限，然后我们就可以在 Javascript 中正常调用了。
可见其正常输出了页面可见区域高度，并且能够随屏幕缩放实时地得到不同的值。
到此这篇关于关于document.body.clientHeight返回值为0的解决方案的文章就介绍到这了,更多相关document.body.clientHeight返回值为0内容请搜索脚本之家以前的文章或继续浏览下面的相关文章，希望大家以后多多支持脚本之家！
相关文章
本文介绍如何在HTML5页面中使用高德地图API实现地图定位功能,首先需要在HTML中引入高德地图API,然后创建一个地图容器,还可以通过点击地图来手动更新位置,这一过程不仅适用2024-10-21
在HTML5中,元素定位是通过设置position属性实现的,相对定位基于元素自身位置调整,绝对定位以最近的已定位父元素为参考,固定定位则相对于浏览器窗口固定位置,z-index属性可2024-10-21- 本文详细介绍了如何使用HTML5和JavaScript构建调用本地摄像头拍照并上传照片的网页应用,内容涵盖从实现摄像头功能,提供了一套完整的操作指南和技术路线,使读者能够在实际项2024-10-21
- 本文详细介绍了Checkbox的基础属性、样式自定义及其应用场景,Checkbox通过<input>元素实现,样式自定义可以通过隐藏原始Checkbox、使用伪元素、JavaScript来实现,Chec2024-10-16
本文介绍了HTML5中表单的自动验证、取消验证、自定义错误信息等功能,通过required、pattern、min、max和step属性,可以实现对表单输入的自动检查，novalidate和formnovalida2024-09-23- 在HTML5项目中使用NotoSansCJK字体能提升用户体验,本文介绍了通过GoogleFonts在线加载和本地托管两种方法,在线加载无需下载,通过GoogleFonts链接快速引入，适合离线使用或2024-09-23
HLS是一种基于HTTP协议的流媒体传输协议，它的出现使得视频的传输更加稳定和可靠，本文给大家介绍Html5如何播放hls格式的视频，感兴趣的朋友一起看看吧2024-08-19
使用<blockquote>标签可以实现页面文字的段落缩进,这一标签也是每使用一次，段落就缩进一次，并且可以嵌套使用，以达到不同的缩进效果，本文通过实例代码介绍HTML5使2024-07-08- 这篇文章主要介绍了window.open()各参数示例详解,本文通过实例代码给大家介绍的非常详细，感兴趣的朋友跟随小编一起看看吧2024-06-19
在现代互联网应用中，有时我们需要让用户在网页上进行签字操作，比如确认文件、填写电子表格或者签署合同，利用 HTML5 的 canvas 画布，我们可以轻松地实现这一功能，为用2024-06-19
最新评论