`
icejadelove
  • 浏览: 138155 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js获得浏览器，屏幕的宽高

浏览器工作 
阅读更多

网页可见区域宽： 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

分享到：
| java或web中解决所有路径问题（最全分析绝 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    js获取浏览器和屏幕的各种宽度高度

    首先，我们来介绍获取浏览器窗口的可见区域宽高。可见区域指的是不包含浏览器工具栏和滚动条的窗口实际显示区域的大小。对于现代浏览器（IE9+、Chrome、Firefox、Opera、Safari），可以使用window对象的innerWidth和...

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

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

    解决Layui数据表格的宽高问题

    在尝试优化表格的宽高适应性时，我们可以采取一些策略来改善其跨平台和跨设备的显示效果。 首先，针对宽度（width）问题，原始代码中使用了固定宽度（如 `width : 1500`），这会导致在不同分辨率的屏幕上出现显示...

    javascript获取网页宽高方法汇总.docx

    本文将详细介绍几种使用 JavaScript 获取网页宽高的方法，并对比不同浏览器下的表现。 1. `document.body.clientWidth` 和 `document.body.clientHeight` 这两个属性分别返回网页可见区域的宽度和高度，不包括滚动...

    取得窗口大小 兼容所有浏览器的js代码.docx

    在JavaScript中，获取浏览器窗口的大小是一个常见的需求，这通常涉及到网页的响应式设计或动态布局。`window.innerWidth`和`window.innerHeight`是JavaScript提供的两个内置属性，它们分别用于获取浏览器视口的宽度...

    图片适应任何分辨率，任何浏览器（CSS）

    为保持图片的原始宽高比，我们可以使用`height: auto`，这样当宽度改变时，高度会自动调整以保持原始的比例。 对于浏览器兼容性问题，CSS3的一些新特性可能在较旧的浏览器中不受支持。为了确保图片适应策略在所有...

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

    通过JavaScript，我们可以轻松地获取浏览器窗口的尺寸和页面元素的尺寸，进而实现动态布局和适配不同的设备屏幕。 ### 获取浏览器窗口尺寸的方法： 1. **document.body.clientWidth** - 描述：返回当前页面的可视...

    jQuery响应式自适应浏览器窗口大小图片排列代码.zip

    该代码的主要目标是创建一个类似Flickr和Google+的图片画廊效果，它能够让图片在不同浏览器窗口大小下保持良好的显示效果，同时保证所有图片具有统一的高度，图片自身的宽高比得以保留。这种布局方式可以确保图片...

    javascript获取网页宽高方法汇总

    不同的浏览器和不同的元素有着不同的属性可以用来获取宽高，本文就来汇总介绍javascript中获取网页宽高的方法。 首先，我们可以通过对document.body的各种属性进行访问来获取页面的宽高信息： - document.body....

    嵌入到HTML的iframe自动适应大小

    随着移动设备的普及和屏幕尺寸的多样化，网站需要具备良好的响应性，即能够根据不同设备的屏幕尺寸自动调整布局和元素尺寸。对于iframe而言，这意味着需要一种机制使其能够根据内部内容的变化或者外部容器的尺寸变化...

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

    这里使用 `Math.min()` 函数取两者中的最小值，这样可以在大多数浏览器中得到正确的高度。 然而，为了确保更好的兼容性和遵循W3C标准，我们在HTML文档开头添加了`<!DOCTYPE>`声明，如`<!DOCTYPE html>`。这将让...

    100个直接可以拿来用的JavaScript实用功能代码片段(1-10)

    64、原生JavaScript获得URL中GET参数值 65、原生JavaScript实现全选通用方法 66、原生JavaScript实现全部取消选择通用方法 67、原生JavaScript实现打开一个窗体通用方法 68、原生JavaScript判断是否为客户端设备 69...

    IE5.X浏览器源码

    其布局引擎Trident通过计算元素的宽高、边距和边框，确定元素在页面中的位置。值得注意的是，IE5.X的盒模型存在差异，内容区域（content）的宽度不包含边框和内填充，这在后续版本中进行了修正。 四、JavaScript...

    three.js 3d坐标转平面坐标

    在3D图形编程中，Three.js是一个非常流行的JavaScript库，用于在Web浏览器中创建和展示三维模型和场景。本教程将深入探讨如何在Three.js环境中将3D坐标转换为2D（平面）坐标，以便在网页上的div元素或其他2D元素上...

    JS测试显示屏分辨率以及屏幕尺寸的方法

    通过将屏幕分辨率除以这个参考宽度，我们可以得到屏幕的物理尺寸（以厘米为单位）。 注意，由于不同的显示器像素密度（DPI）不同，将像素值转换为物理尺寸可能不是完全准确的。这里我们简单地假设1厘米等于固定数量...

    jquery自适应屏幕图片瀑布流布局代码

    2. **CSS样式**：设置基本样式，如容器的宽高比、内边距等，以及图片的相对定位，以便于后续的jQuery操作。 3. **jQuery加载**：在文档加载完成后，使用jQuery的`.ready()`函数初始化布局。获取容器元素的宽度，...

    js获得页面的高度和宽度的方法

    另外，由于一些JavaScript的属性可能在不同浏览器或者不同版本的浏览器中有所差异，在跨浏览器测试时应当特别注意这些差异性，并采取兼容性措施。同时，当文档的内容完全加载后使用这些尺寸相关的属性更为可靠，可以...

    一个PostCSS插件用于自动为背景图像添加CSS规则宽度和高度

    3. **响应式设计**：对于响应式设计，明确的图像尺寸可以帮助更好地调整布局，确保在不同屏幕尺寸下保持视觉效果的一致性。 在JavaScript开发中，集成`postcss-background-image-auto-size`通常涉及到以下步骤： 1...

    js流式布局插件.zip

    1. **兼容性**：虽然Flexbox和Grid布局在现代浏览器中得到了广泛支持，但仍然需要关注对旧版浏览器的兼容性。插件可能已经处理了这个问题，但如果未处理，可能需要引入polyfill来保证在旧版浏览器上的正常工作。 2....

    jQuery网站宽屏banner幻灯片切换代码

    5. **JavaScript代码**：`js`文件夹内的脚本文件负责实现幻灯片的逻辑功能，如自动轮播、鼠标悬停暂停、点击切换等。jQuery提供了方便的`fadeIn()`和`fadeOut()`方法来实现图片的淡入淡出效果，还可以利用定时器`...

Magicbox
Global site tag (gtag.js) - Google Analytics