网页可见区域宽: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
屏幕设置 window.screen.colorDepth 位彩色
屏幕设置 window.screen.deviceXDPI 像素/英寸
网页可见区域宽: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
屏幕设置 window.screen.colorDepth 位彩色
屏幕设置 window.screen.deviceXDPI 像素/英寸
<html> <head> <title>获取当前对象大小以及屏幕分辨率等</title> <body> <div style=" width:88%;margin:30px auto; color:blue;" id="div_html"> </div> <script type="text/javascript"> var s = ""; s += " 网页可见区域宽:"+ document.body.clientWidth+"<br />"; s += " 网页可见区域高:"+ document.body.clientHeight+"<br />"; s += " 网页可见区域宽:"+ document.body.offsetWidth + " (包括边线和滚动条的宽)"+"<br />"; s += " 网页可见区域高:"+ document.body.offsetHeight + " (包括边线的宽)"+"<br />"; s += " 网页正文全文宽:"+ document.body.scrollWidth+"<br />"; s += " 网页正文全文高:"+ document.body.scrollHeight+"<br />"; s += " 网页被卷去的高(ff):"+ document.body.scrollTop+"<br />"; s += " 网页被卷去的高(ie):"+ document.documentElement.scrollTop+"<br />"; s += " 网页被卷去的左:"+ document.body.scrollLeft+"<br />"; s += " 网页正文部分上:"+ window.screenTop+"<br />"; s += " 网页正文部分左:"+ window.screenLeft+"<br />"; s += " 屏幕分辨率的高:"+ window.screen.height+"<br />"; s += " 屏幕分辨率的宽:"+ window.screen.width+"<br />"; s += " 屏幕可用工作区高度:"+ window.screen.availHeight+"<br />"; s += " 屏幕可用工作区宽度:"+ window.screen.availWidth+"<br />"; s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色"+"<br />"; s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸"+"<br />"; document.getElementById("div_html").innerHTML = s; </script> </body> </html>
相关推荐
用JavaiScript里的属性来获取浏览器的版本,屏幕的分辨率,操作系统。
### JS 获取屏幕分辨率的方法 在Web开发中,获取用户的屏幕分辨率是实现响应式设计和优化用户体验的重要步骤之一。本文将详细介绍如何使用JavaScript来获取屏幕分辨率,并探讨这些信息如何帮助我们实现div元素的...
这篇博文“JS 获取浏览器参数”可能探讨了如何利用JavaScript来收集关于用户浏览器的信息,包括但不限于浏览器类型、版本、操作系统、屏幕分辨率等。 首先,我们可以使用`navigator`对象来获取浏览器的基本信息。`...
该脚本主要实现了根据用户所使用的浏览器类型以及屏幕分辨率来动态加载不同的CSS样式表。这种技术在早期网页开发中较为常见,用于实现针对不同设备或浏览器的适配方案。 #### 二、解析脚本逻辑 1. **检测浏览器...
首先,我们需要了解JavaScript是如何获取浏览器分辨率的。在JavaScript中,`window.innerWidth` 和 `window.innerHeight` 属性分别提供了浏览器视口的宽度和高度。视口是用户当前可见的部分,不包括浏览器的工具栏和...
### JS 获取浏览器窗口大小 在前端开发中,经常需要获取浏览器窗口的大小,以便于根据不同的屏幕尺寸调整页面布局或实现响应式设计。本文将详细介绍如何使用JavaScript来获取浏览器窗口的宽度、高度以及相关的属性...
使用JavaScript获取网页的可见区域大小,可以使用`document.body.clientWidth`和`document.body.clientHeight`。这两个属性分别返回视口(也就是浏览器窗口中网页可见区域)的宽度和高度,不包括边框、滚动条或外边...
这段代码的主要目的是检测用户所使用的浏览器类型(如IE、Firefox或其他)以及其屏幕分辨率,然后根据这些信息动态地更改页面的样式表。这个过程涉及到几个关键部分: 1. **浏览器类型检测**:通过检查`navigator....
这些对象提供了丰富的信息,包括但不限于浏览器类型、版本、语言设置、操作系统、屏幕分辨率等。下面我们将深入探讨这些对象及其属性。 1. **navigator对象**: `navigator`对象提供了有关用户浏览器的信息。一些...
该文档是所有的js获取屏幕分辨率的集合,注意:浏览器缩放会影响获取的参数。
本文将详细解析如何通过JavaScript获取不同浏览器中的浏览器高度、宽度以及相关的一些其他尺寸信息。 1. **浏览器高度和宽度的获取** - `document.body.clientWidth` 和 `document.body.clientHeight`: 这两个...
在JavaScript中,获取浏览器的高度和宽度是常见的需求,用于适应不同的屏幕尺寸和实现响应式设计。然而,由于不同浏览器之间的差异,获取这些值的方法并不统一。本文将详细介绍如何在多种浏览器环境下,包括IE、Fire...
在 Web 开发中,获取浏览器的高度和宽度值是非常重要的,因为它能够帮助我们更好地布局页面元素和实现响应式设计。然而,浏览器的高度和宽度值获取方法却因浏览器的不同而有所区别。在本文中,我们将讨论如何在不同...
以下将详细介绍如何通过JavaScript获取这些信息,并探讨不同浏览器间可能存在的差异。 首先,我们可以使用`window.innerWidth`和`window.innerHeight`来获取浏览器窗口的总宽度和高度,包括工具栏和其他用户界面...
### JS判断浏览器分辨率调用不同CSS样式的实现方法 在Web开发中,为了提供更好的用户体验,根据不同的设备分辨率(屏幕尺寸)应用相应的CSS样式是非常重要的。这种方法有助于优化页面布局、提高加载速度,并确保...
在前端开发中,经常需要获取浏览器的可见窗口大小以及其他相关信息,以便能够根据不同的设备和浏览器环境来优化网页布局与用户体验。本文将详细解析如何通过JavaScript来获取不同浏览器下的窗口尺寸,并探讨一些特殊...
在JavaScript中,获取浏览器基本信息是非常常见的需求,这包括浏览器窗口的尺寸、可视区域、滚动位置以及屏幕分辨率等。以下是一些关键知识点的详细说明: 1. **网页可见区域**: - `document.body.clientWidth`:...
总结起来,通过jQuery和JavaScript,我们可以轻松地获取浏览器窗口、文档以及屏幕的各种尺寸信息,从而更好地优化网页布局,确保在各种设备和分辨率下都能提供良好的用户体验。理解并熟练运用这些方法是现代Web开发...
本文将深入探讨如何通过JavaScript来检测浏览器类型及屏幕分辨率,并据此选择合适的CSS文件加载到网页中。 #### 一、基础概念 1. **浏览器检测**:通过分析`navigator.userAgent`字符串来判断浏览器类型。这种方法...