`
caibinghong
  • 浏览: 149900 次
  • 性别: Icon_minigender_1
  • 来自: 福建
社区版块
存档分类
最新评论

关于获取浏览器工作区的高度

阅读更多
写道
var getWinHeight = function() {
var winHeight;
if (window.innerHeight)
winHeight = window.innerHeight;
else if ((document.body) && (document.body.clientHeight))
winHeight = document.body.clientHeight;
// 通过深入Document内部对body进行检测,获取窗口大小

if (document.documentElement && document.documentElement.clientHeight &&
document.documentElement.clientWidth) {
winHeight =document.documentElement.clientHeight; }

return winHeight;
}

 注意要点:

1.如果你发现你的页面上没有这一句话<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

那么这时候 document.body.clienHeight 为工作区的高度    

否则  加了这一句的话那么   document.body.clienHeight 就只是body 标签的高度 , 这时候应该要用  document.documentElement && document.documentElement.clientHeight &&
document.documentElement.clientWidth   来判断    因为这时候 document.documentElement.clientHeight 就是工作区的高度了

 

因此这个方法是分别判断了 不同标准下 不同浏览器的工作区高度值

document.documentElement (就是HMTL标签)在FF下请加上标准约束

0
0
分享到:
评论

相关推荐

    js 获取浏览器高度和宽度值(多浏览器)

    在 Web 开发中,获取浏览器的高度和宽度值是非常重要的,因为它能够帮助我们更好地布局页面元素和实现响应式设计。然而,浏览器的高度和宽度值获取方法却因浏览器的不同而有所区别。在本文中,我们将讨论如何在不同...

    js获取浏览器高度和宽度值(多浏览器)

    - `window.screen.availHeight` 和 `window.screen.availWidth` 提供了屏幕可用的工作区高度和宽度,不包括任务栏和其他非用户交互区域。 在实际开发中,为了确保代码的兼容性,通常会使用条件语句或者库如jQuery来...

    关于获取各种浏览器可见窗口大小

    s += "屏幕可用工作区高度:" + window.screen.availHeight + " "; s += "屏幕可用工作区宽度:" + window.screen.availWidth + " "; s += "你的屏幕设置是" + window.screen.colorDepth + "位彩色 "; ...

    js获取浏览器高度和宽度值.pdf

    在JavaScript中,获取浏览器的高度和宽度是常见的需求,这有助于我们进行页面布局、响应式设计或者自适应调整。本文将详细解析如何通过JavaScript获取不同浏览器中的浏览器高度、宽度以及相关的一些其他尺寸信息。 ...

    JS获取浏览器窗口大小获取屏幕,浏览器,网页高度宽度[文].pdf

    - `window.screen.availHeight`:返回屏幕可用的工作区高度,即用户可以用来显示内容的区域,不包括任务栏等系统界面。 - `window.screen.availWidth`:返回屏幕可用的工作区宽度。 5. **事件坐标**: - `event....

    javascript获取页面各种高度

    - **window.screenTop** 和 **window.screenLeft**: 分别获取浏览器窗口相对于整个屏幕左上角的垂直和水平距离,单位为像素。 - **window.screen.height** 和 **window.screen.width**: 分别获取用户的显示器的高度...

    js/jquery获取浏览器窗口可视区域高度和宽度以及滚动条高度实现代码

    通常情况下,如果需要使用jQuery框架来实现相关功能,可以利用jQuery提供的尺寸获取方法,如$(window).height()和$(window).width()来获取浏览器窗口的可视区域高度和宽度。$(document).height()和$(document).width...

    js获取浏览器基本信息大全

    对于屏幕分辨率和工作区,`window.screen.height`和`window.screen.width`提供了屏幕分辨率的高度和宽度,而`window.screen.availHeight`和`window.screen.availWidth`提供了屏幕可用工作区的高度和宽度。工作区是指...

    JavaScript获取网页、浏览器、屏幕高度和宽度汇总

    - `window.screen.availHeight` 和 `window.screen.availWidth`: 提供了屏幕可用的工作区高度和宽度,即排除了任务栏和其他屏幕元素后的空间。 5. **HTML元素定位**: - `scrollHeight`, `scrollLeft`, `...

    js获取屏幕的高度与宽度

    此外,window.screen.availWidth和window.screen.availHeight可以得到屏幕的可用工作区宽度和高度,这通常是屏幕总分辨率去掉任务栏和操作系统其他界面元素后剩余的部分。 对于页面元素的尺寸,可以使用document....

    js获取浏览器的各种属性

    - window.screen.availHeight:获取屏幕可用工作区的高度,不包括系统任务栏和界面元素。 - window.screen.availWidth:获取屏幕可用工作区的宽度,不包括系统任务栏和界面元素。 5. 获取滚动位置: - window....

    jQuery获取浏览器中的分辨率实现代码

    `window.screen.availHeight`则是屏幕可用的工作区高度,不包括任务栏和其他系统元素。 总结起来,通过jQuery和JavaScript,我们可以轻松地获取浏览器窗口、文档以及屏幕的各种尺寸信息,从而更好地优化网页布局,...

    计算Web页面的高度并给div赋高度

    - 计算出浏览器窗口的工作区高度(即浏览器视口高度减去顶部和底部元素的高度): ```javascript var height1 = window.screen.availHeight - (window.screenTop + (window.screen.height - window.screen....

    js获取网页高度(详细整理)

    本篇文章将详细介绍如何使用JavaScript获取网页的可见区域高度、屏幕分辨率的高度、屏幕可用工作区高度以及浏览器窗口的高度。 首先,我们来看一下网页可见区域的高度和宽度。这部分是指用户当前可以看到的页面区域...

    js 获取屏幕各种宽高的方法(浏览器兼容)

    - `window.screen.availHeight`:获取屏幕可用工作区的高度,不包括任务栏等占用部分。 对于网页元素的宽高信息,常用的有: - `document.body.clientWidth`:网页可见区域的宽度,不包括边框和滚动条。 - `...

    详解js动态获取浏览器或页面等容器的宽高

    - 描述:返回屏幕可用工作区的高度,不包括被系统任务栏等占去的高度。 - 使用场景:确定页面内容在实际可用屏幕区域的高度。 14. **window.screen.availWidth** - 描述:返回屏幕可用工作区的宽度,不包括被...

    html页面高度不固定在不同浏览器下的兼容性设置

    s += "屏幕可用工作区高度:" + window.screen.availHeight; s += "屏幕可用工作区宽度:" + window.screen.availWidth; s += "你的屏幕设置是 " + window.screen.colorDepth + " 位彩色"; s += "你的屏幕设置 ...

Global site tag (gtag.js) - Google Analytics