javascript得到屏幕分辨率和网页可见区域等方法
<body><SCRIPT LANGUAGE="JavaScript">...
var s = "";
s += " 网页可见区域宽："+ document.body.clientWidth;
s += " 网页可见区域高："+ document.body.clientHeight;
s += " 网页可见区域宽："+ document.body.offsetWidth +" (包括边线和滚动条的宽)";
s += " 网页可见区域高："+ document.body.offsetHeight +" (包括边线的宽)";
s += " 网页正文全文宽："+ document.body.scrollWidth;
s += " 网页正文全文高："+ document.body.scrollHeight;
s += " 网页被卷去的高："+ document.body.scrollTop;
s += " 网页被卷去的左："+ document.body.scrollLeft;
s += " 网页正文部分上："+ window.screenTop;
s += " 网页正文部分左："+ window.screenLeft;
s += " 屏幕分辨率的高："+ window.screen.height;
s += " 屏幕分辨率的宽："+ window.screen.width;
s += " 屏幕可用工作区高度："+ window.screen.availHeight;
s += " 屏幕可用工作区宽度："+ window.screen.availWidth;
s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色";
s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸";
alert(s);
</SCRIPT>
分享到：
相关推荐
### JS 获取屏幕分辨率的方法 在Web开发中，获取用户的屏幕分辨率是实现响应式设计...通过上述方法和技术，我们可以有效地获取用户的屏幕分辨率和浏览器窗口的尺寸信息，这对于实现响应式设计和优化用户体验非常关键。
标题“js获取网页可见区域、正文以及屏幕分辨率的高度”所涵盖的知识点主要集中在如何使用JavaScript来测量网页上的不同区域的高度。在网站开发和维护过程中，对页面尺寸的精准测量对于页面布局和响应式设计至关重要...
总的来说，通过这些JavaScript属性和方法，开发者能够实现对网页布局的精细控制，以及对用户显示环境的检测，从而为不同分辨率和设备提供更好的用户体验。在设计响应式网站时，这类信息尤为重要，因为它们可以帮助...
这两个属性分别返回网页可见区域的宽度和高度，不包括滚动条。它们只考虑了用户当前能看到的部分，对于没有滚动条或者内容未超过浏览器可视区域的情况，这两个属性能提供准确的尺寸。 2. `document.body....
- document.body.clientWidth：获取网页可见区域的宽度，不包括边框、滚动条，也不包括垂直方向上的边距和边框。 - document.body.clientHeight：获取网页可见区域的高度，同样不包括边框、滚动条，也不包括水平方向...
在JavaScript中，获取网页、浏览器和屏幕的高度与宽度是常见的需求，这主要涉及到...在具体应用中，应根据实际需求选择合适的方法，例如在处理页面滚动、布局计算或响应式设计时，这些属性和方法都是不可或缺的工具。
本文主要探讨了JavaScript中获取和判断浏览器窗口、屏幕以及网页高度和宽度的方法，这对于网页布局和响应式设计至关重要。在JavaScript中，有多种属性和方法可以用来获取不同维度的尺寸信息。 首先，我们关注的是...
使用`addEventListener`方法监听`mouseover`和`mouseout`事件，当鼠标进入（悬停）广告区域时触发停止移动的函数，离开时恢复移动。 5. **停止和恢复动画**： 可以通过修改CSS的`left`或`top`属性来控制广告的...
除了上述获取浏览器尺寸的方法外，还可以通过以下属性来获取网页可见区域的尺寸： 1. **网页可见区域宽度**： ```javascript document.body.clientWidth; ``` 2. **网页可见区域高度**： ```javascript ...
以下将详细解析如何利用JavaScript来获取这些参数，包括页面尺寸、滚动位置、屏幕分辨率等关键知识点。 ### 页面尺寸与滚动位置 #### `document.body.clientWidth` 和 `document.body.clientHeight` 这两个属性...
4. **响应式设计**：考虑到不同设备的屏幕大小和分辨率，现代网页模板必须具备响应式设计。这意味著网页布局会根据用户的设备自动调整，无论是大屏桌面还是小屏移动设备，都能提供良好的用户体验。 5. **图片与图形...
1. 网页可见区域的尺寸：这部分指的是浏览器窗口中未被其他界面元素（如菜单栏、工具栏等）遮挡的区域，用户可以在此区域浏览网页内容。 - 网页可见区域的宽度可以通过`document.body.clientWidth`获取，它不包括...
- **媒体查询**：使用`@media`规则来针对不同的设备屏幕尺寸和分辨率设置不同的样式规则，实现响应式设计。 - **颜色管理**：通过使用十六进制颜色代码或颜色名称来指定背景色、字体颜色等。 - **字体样式**：...
综上所述，JavaScript 和 jQuery 提供了丰富的 API 来处理网页尺寸和位置的查询，开发者可以根据实际需求选择合适的方法来获取和利用这些信息。无论是进行布局调整、动态内容加载，还是交互设计，这些知识都至关重要...
s += "网页可见区域宽（包括边线和滚动条的宽）：" + document.body.offsetWidth + " "; s += "网页可见区域高（包括边线的宽）：" + document.body.offsetHeight + " "; s += "网页正文全文宽：" + ...
在JavaScript中，对固定层（通常指在页面滚动时始终保持在视口中的元素）进行定位是一项常见的需求。本文将深入探讨如何使用JavaScript有效地定位...总之，理解这些JavaScript属性和方法是实现动态布局和定位的关键。
通过使用媒体查询@media，我们可以创建响应式的菜单，使其在不同分辨率和屏幕尺寸下都能自适应显示。例如，针对小屏幕设备，我们可以设置菜单项为水平堆叠，而在大屏幕上则呈现为水平排列。此外，CSS3的过渡...
1. 网页可见区域尺寸：通过`document.body.clientWidth`和`document.body.clientHeight`可以获取网页的可见区域宽度和高度，而`document.body.offsetWidth`和`document.body.offsetHeight`则包括边框在内的宽度和...