`
齐晓威_518
  • 浏览: 618778 次
  • 性别: Icon_minigender_1
  • 来自: 郑州
社区版块
存档分类
最新评论

JQuery获取浏览器窗口的可视区域高度和宽度,滚动条高度

 
阅读更多

在前端交互设计中,当需要获取用户浏览器的可视区域时,常碰到浏览器兼容问题,幸好jquery解决了这个问题。

alert($(window).height()); //浏览器时下窗口可视区域高度

alert($(document).height()); //浏览器时下窗口文档的高度

alert($(document.body).height());//浏览器时下窗口文档body的高度

alert($(document.body).outerHeight(true));//浏览器时下窗口文档body的总高度 包括border padding margin

alert($(window).width()); //浏览器时下窗口可视区域宽度

alert($(document).width());//浏览器时下窗口文档对于象宽度

alert($(document.body).width());//浏览器时下窗口文档body的高度

alert($(document.body).outerWidth(true));//浏览器时下窗口文档body的总宽度 包括border padding margin

 

alert($(document).scrollTop()); //获取滚动条到顶部的垂直高度

alert($(document).scrollLeft()); //获取滚动条到左边的垂直宽度

分享到:
评论

相关推荐

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

    获取浏览器窗口的可视区域高度和宽度,滚动条高度有需要的朋友可参考一下。IE中,浏览器显示窗口大小只能以下获取: 代码如下复制代码 代码如下:document.body.offsetWidth document.body.offsetHeight在声明了...

    jQuery获取浏览器窗口的宽度和高度

    首先,`$(window).height()` 和 `$(window).width()` 是用来获取浏览器当前窗口可视区域的高度和宽度,也就是用户在屏幕上看到的网页部分,不包括滚动条。例如,在提供的代码中,`$(window).height()` 返回的是267...

    javascript获取当前页面可视高度和宽度及浏览器宽度和高度的函数.rar

    这两个属性分别表示了浏览器窗口的可见宽度和可见高度,不包括滚动条。 2. **浏览器窗口尺寸**: 浏览器窗口尺寸指的是整个浏览器窗口的大小,包括了页面内容、滚动条和其他元素。获取浏览器窗口的完整宽度和高度...

    jQuery 获取屏幕高度和宽度

    屏幕高度是指浏览器窗口可视区域的垂直尺寸,而屏幕宽度则是指水平方向的尺寸。这些信息对于动态布局和适配不同设备屏幕的网页设计特别有用。 在jQuery中,获取屏幕高度和宽度的方法非常直观。我们可以使用`$...

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

    对于W3C的标准,`document.documentElement.clientWidth` 和 `document.documentElement.clientHeight` 应该返回浏览器窗口的可视区域大小,但不同浏览器的实现有所差异。在没有定义标准的情况下,IE返回0,而Fire...

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

    - `document.body.clientWidth`:返回网页在浏览器窗口中的可视宽度,不包括滚动条。 - `document.body.clientHeight`:返回网页在浏览器窗口中的可视高度,同样不包括滚动条。 - `document.body.offsetWidth`:...

    JavaScript 获取浏览器的显示区域大小信息

    - **`clientHeight`**:返回文档的可见高度(即内容区域的高度),同样不包括滚动条和边框。 ```javascript var bodyWidth = document.body.clientWidth; // 页面宽度 var bodyHeight = document.body.clientHeight...

    页面出现滚动条的时候如何让滚动条不影响页面宽度

    在网页设计中,当页面内容超出了可视区域的宽度时,浏览器会自动添加水平滚动条以允许用户水平滚动查看隐藏的内容。然而,滚动条本身会占用一定的空间,这可能会导致页面宽度缩小,从而影响布局的整体美观性。为了不...

    JS,Jquery获取各种屏幕的宽度和高度

    - 这两个属性分别用于获取可视区域的宽度和高度,不包括滚动条和边框。 2. **`document.body.offsetWidth`** 和 **`document.body.offsetHeight`**: - 这两个属性返回元素的宽度和高度,包括内容、内边距、边框...

    jquery如何获取元素的滚动条高度等实现代码

    而`$(window).scrollTop()`则会得到浏览器窗口内的滚动条位置。 对于元素自身的高度和宽度,可以使用`$(obj).height()`和`$(obj).width()`方法。这些方法允许你获取或设置元素的尺寸,非常方便。如果你需要获取整个...

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

    另外,JavaScript的`document.body.clientWidth`和`document.body.clientHeight`返回当前网页在浏览器窗口内的可视宽度和高度,不包括滚动条。而`document.body.offsetWidth`和`document.body.offsetHeight`则包含了...

    jQuery获取页面及个元素高度、宽度的总结——超实用

    - **获取浏览器显示区域的高度**:`$(window).height()` 这个方法返回浏览器窗口可视区域的高度,不包括工具栏等非显示内容。 - **获取浏览器显示区域的宽度**:`$(window).width()` 返回的是浏览器可视区域的宽度。...

    js获取页面及个元素高度、宽度的代码

    - `document.body.clientWidth`:返回浏览器窗口中网页可视区域的宽度,不包括滚动条。 - `document.body.clientHeight`:返回浏览器窗口中网页可视区域的高度,不包括滚动条。 - `document.body.offsetWidth`:...

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

    - 使用 `window.innerWidth` 和 `window.innerHeight` 来获取浏览器窗口的可视区域尺寸,这两个属性在现代浏览器中都得到了很好的支持。 - 在处理旧版浏览器或兼容性问题时,可以使用 `document.documentElement....

    JQUERY自定义滚动条

    在网页设计中,滚动条是不可或缺的一部分,它帮助用户浏览超过屏幕可视区域的内容。当涉及到高级用户界面和用户体验(UI/UX)设计时,自定义滚动条可以提升网站的美观性和交互性。JQUERY,一个广泛使用的JavaScript...

    JQuery获取当前屏幕的高度宽度的实现代码

    1. **$(window).height()**: 这个方法返回的是浏览器当前窗口可视区域的高度,即用户可以看到的网页部分,不包括滚动条。当用户调整浏览器窗口大小时,这个值会实时更新。 2. **$(document).height()**: 与$(window...

Global site tag (gtag.js) - Google Analytics