`

javascript,Jquery获取屏幕宽度和高度方法

 
阅读更多
Javascript:

网页可见区域宽: document.body.clientWidth
网页可见区域高: document.body.clientHeight
网页可见区域宽: document.body.offsetWidth (包括边线的宽)
网页可见区域高: document.body.offsetHeight (包括边线的高)
网页正文全文宽: document.body.scrollWidth
网页正文全文高: document.body.scrollHeight
网页被卷去的高: document.body.scrollTop
网页被卷去的左: document.body.scrollLeft
网页正文部分上: window.screenTop
网页正文部分左: window.screenLeft
屏幕分辨率的高: window.screen.height
屏幕分辨率的宽: window.screen.width
屏幕可用工作区高度: window.screen.availHeight
屏幕可用工作区宽度: window.screen.availWidth

JQuery:

$(document).ready(function(){
alert($(window).height()); //浏览器当前窗口可视区域高度
alert($("body").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的总宽度 包括
})


分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    jQuery 获取屏幕高度和宽度

    本文将详细讲解如何使用jQuery获取屏幕的高度和宽度,这对于创建响应式网页设计或者根据屏幕尺寸调整元素布局至关重要。 首先,我们需要了解什么是屏幕高度和宽度。屏幕高度是指浏览器窗口可视区域的垂直尺寸,而...

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

    ### JS与jQuery获取屏幕宽度和高度的相关知识点 在前端开发中,经常需要获取用户的屏幕尺寸信息,例如宽度和高度等,这些数据对于响应式设计、布局调整等方面具有重要作用。通过JavaScript(简称JS)和jQuery这两种...

    jQuery自适应父容器宽度高度代码

    总的来说,"jQuery自适应父容器宽度高度代码"是利用jQuery动态计算和调整文本字体大小的示例,以实现文本在各种屏幕尺寸下的良好展示。通过对HTML、CSS和JavaScript的深入理解,我们可以创建出更灵活、更具适应性的...

    【Jquery经典特效18】jQuery自适应宽度跟高度相册代码

    在本文中,我们将深入探讨如何使用jQuery实现一个自适应宽度和高度的相册代码,这是Jquery经典特效系列中的第18个主题。这个特效对于现代网页设计至关重要,因为它允许图片展示在不同屏幕尺寸和设备上都能保持良好的...

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

    本压缩包文件"javascript获取当前页面可视高度和宽度及浏览器宽度和高度的函数.rar"包含了相关知识点的详细讲解,主要集中在JavaScript的DOM操作和窗口对象(Window)的属性与方法上。 1. **当前页面可视区域尺寸**...

    Jquery图片自适应宽度和表格List自适应屏幕宽度!

    本文将详细讲解如何使用JQuery实现图片的自适应宽度以及表格List的自适应屏幕宽度。 首先,让我们关注JQuery图片自适应宽度的实现。JQuery是一种强大的JavaScript库,它简化了DOM操作,事件处理和动画效果。要使...

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

    以下是对标题"JQuery获取当前屏幕的高度宽度的实现代码"以及描述中所涉及知识点的详细解释。 1. **jQuery基础**: jQuery是一个JavaScript库,它简化了HTML DOM遍历、事件处理、动画制作以及Ajax交互。使用`$`符号...

    解决jQuery动态获取手机屏幕高和宽的问题

    首先,jQuery提供了`$(window).height()`和`$(window).width()`这两个方法来获取当前窗口(包括滚动条)的可视区域高度和宽度。然而,在某些情况下,特别是在页面加载的早期阶段,这些方法可能返回不准确的结果,...

    jQuery自适应宽度跟高度相册代码.zip

    在JavaScript部分,jQuery提供了一系列的方法来获取和改变元素的属性,如宽度和高度。当窗口大小发生变化时,通过`$(window).resize()`函数监听窗口大小的变化,并根据新的窗口宽度调整相册的布局。同时,`$...

    JS和jquery获取各种屏幕的宽度和高度的代码

    在网页开发中,获取屏幕、窗口以及网页内容的宽度和高度是常见的需求,这有助于我们进行响应式设计或者实现特定的...通过结合JavaScript和jQuery提供的这些属性和方法,我们可以创建出更加灵活和适应性强的网页应用。

    jQuery自适应宽度跟高度相册代码

    5. **响应式图片**:使用`<img>`标签的`srcset`属性或`picture`元素,可以根据设备的像素密度和屏幕宽度提供不同分辨率的图片,提高加载速度和用户体验。 6. **动画效果**:jQuery的动画功能可以让相册的切换更加...

    jQuery 获取屏幕高度、宽度的简单实现案例

    以下是一些基于jQuery的实用方法和技巧,用于获取屏幕的宽度和高度。 首先,通过jQuery对象获取当前窗口的可视区域高度和宽度,可以使用以下属性: - $(window).height():返回浏览器当前窗口的可视区域高度。 - $...

    js和jquery如何获取图片真实的宽度和高度

    - 如果图片的真实宽度大于浏览器宽度,可以将图片的宽度设置为100%,高度自适应,以确保图片能够适应屏幕宽度而不失真。 - 如果图片宽度小于浏览器宽度,可以设置图片宽度和高度为原始尺寸,以保证图片展示的精细度...

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

    在JavaScript中,获取浏览器的高度和宽度是常见的需求,用于适应不同的屏幕尺寸和实现响应式设计。然而,由于不同浏览器之间的差异,获取这些值的方法并不统一。本文将详细介绍如何在多种浏览器环境下,包括IE、Fire...

    使用JavaScript JQuery实现网页翻屏.pdf

    接下来,我们使用JQuery获取当前对象,实现鼠标滚动,实现屏幕上翻或下翻。JQuery提供了独特的选择器、DOM操作、高效灵活的事件处理机制、丰富的插件和完善的Ajax交互等优势。我们可以使用JQuery的wheelDelta事件来...

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

    ### JavaScript 获取浏览器的显示区域大小信息 在网页开发过程中,获取浏览器显示区域的大小是非常重要的一个环节,这对于响应式设计、动态布局调整等场景尤为重要。本文将详细介绍如何使用JavaScript来获取浏览器...

Global site tag (gtag.js) - Google Analytics