函数封装屏幕可视区窗口的坐标window.innerWidth（clientWidth）

最新推荐文章于 2024-05-10 17:27:37 发布

原创最新推荐文章于 2024-05-10 17:27:37 发布 · 268 阅读

0 ·

CC 4.0 BY-SA版权

前端同时被 2 个专栏收录

72 篇文章

订阅专栏

22 篇文章

订阅专栏

本文详细介绍了如何在不同浏览器和模式下，使用JavaScript获取浏览器可视区的宽度和高度。包括window.innerWidth, window.innerHeight的使用，以及在IE8及以下版本中如何适配，通过检查document.compatMode确定使用body或documentElement的clientWidth和clientHeight。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

//求可视区窗口的尺寸
window.innerWidth

window.innerHeight

window.innerWidth = width + padding + border + 纵向滚动条宽度
window.innerHeight = height + padding + border + 横向滚动条高度

//IE8以下
document.body.clientWidth(怪异模式)/document.documentElement.clientWidth(标准模式)
document.compatMode//检查是什么模式
backCompat//向后兼容怪异模式

function getViewOffset(){

if(window.innerWidth){
return{
w:window.innerWidth,
h:window.innerHeight
}
}else{
if(document.compatMode==='BackMode'){
return{
w:document.body.clientWidth,
h:document.body.clientHeight
}
}else{
return{
w:document.documentElement.clientWidth,
h:document.documentElement.clientHeight
}
}
}
}