<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> document.body对象, window对象尺寸信息</TITLE>
<META NAME="Author" CONTENT="许明会">
<META NAME="Keywords" CONTENT="clientHeight screen body">
<META NAME="Description" CONTENT="获取网页区域,屏幕区域">
<script type="text/javascript">
function displayScreenSize()
{
//alert("heelo0");
var bodyWidth =document.body.clientWidth; //网页可见区域宽
var bodyHeight =document.body.clientHeight; //网页可见区域高
var bodyWidthWithBorder =document.body.offsetWidth; //网页可见区域宽(包括边线的宽)
var bodyHeightWithBorder =document.body.offsetHeight; //网页可见区域高(包括边线的宽)
var bodyWidthWithScroll =document.body.scrollWidth; //网页正文全文宽
var bodyHeightWithScroll =document.body.scrollHeight; //网页正文全文高
var bodyTopHeight =document.body.scrollTop; //网页被卷去的上边距
var bodyLeftWidth =document.body.scrollLeft; //网页被卷去的左边距
var windowLeftWidth =window.screenLeft; //网页正文部分左边距
var windowTopHeight =window.screenTop; //网页正文部分上边距
var screenWidth =window.screen.width; //屏幕分辨率的宽
var screenHeight =window.screen.height; //屏幕分辨率的高
var screenAvailHeight =window.screen.availHeight; //屏幕可用工作区高度
var screenAvailWidth =window.screen.availWidth; //屏幕可用工作区宽度
var info = "";
info +="document.body.clientWidth:"+bodyWidth + "<br/>" ;
info +="document.body.clientHeight:"+bodyHeight + "<br/>"
info +="<br/>"
info +="document.body.offsetWidth:"+bodyWidthWithBorder + "<br/>"
info +="document.body.offsetHeight:"+bodyHeightWithBorder + "<br/>"
info +="<br/>"
info +="document.body.scrollWidth:"+bodyWidthWithScroll + "<br/>"
info +="document.body.scrollHeight:"+bodyHeightWithScroll + "<br/>"
info +="document.body.scrollTop:"+bodyTopHeight + "<br/>"
info +="document.body.scrollLeft:"+bodyLeftWidth + "<br/>"
info +="<br/>"
info +="window.screenTop:"+windowLeftWidth + "<br/>"
info +="window.screenLeft:"+windowTopHeight + "<br/>"
info +="<br/>"
info +="window.screen.width:"+screenWidth + "<br/>"
info +="window.screen.height:"+screenHeight + "<br/>"
info +="window.screen.availHeight:"+screenAvailHeight + "<br/>"
info +="window.screen.availWidth:" +screenAvailWidth + "<br/>"
info +="<br/>"
document.all("divInfo").innerHTML = info;
}
</script>
</HEAD>
<BODY onresize="displayScreenSize();">
<div id="divInfo">
</div>
</BODY>
</HTML>
分享到:
相关推荐
数控屏Nodejs C ++插件获取设备屏幕尺寸编译sudo yarn test 或者sudo npm run test待办事项清单打字稿npm脚本: node-gyp build和node-gyp rebuild之间有什么区别捕获错误边界参考
Javascript获取页面、屏幕尺寸大小参数
js用来取得客户端屏幕尺寸浏览器大小等所有参数
前端JS库,适合所有手机屏幕尺寸 据说以前的淘宝是用的它.zip
主要介绍了JS图片等比例缩放方法,结合完整实例形式分析了javascript针对页面图片元素属性操作的相关技巧,需要的朋友可以参考下
如何用JS特效显示自己的屏幕分辨率以及屏幕尺寸呢,你会吗?如果不会,那么下面有个不错的方法,大家可以参考下
既然身为程序员就不能只会一门语言是,电脑显示器流行的尺寸每年都在增大, 网络上各种层出不穷的js特效,以前接触过的一些特效网站, 那年还是免费下载特效,现在开始扣分下载机制了, 如果网站用户体验一直停留在...
使用屏幕尺寸 这有助于您根据屏幕尺寸编写条件代码,或获取屏幕尺寸值 安装 npm install --save use-screen-size yarn add use-screen-size 例子 这是显示屏幕宽度,屏幕高度和当前屏幕模式的快速示例 import React ...
轻量、易用的 jQuery 插件,如果你需要你的视频能够自动适应网页的宽度,FitVids.js这个jquery插件可以帮助你
React-native库用于创建响应式的样式,基于屏幕尺寸返回不同的样式
屏幕尺寸 这是一个Vue套件,可帮助您根据屏幕尺寸编写条件代码,或获取屏幕尺寸值 安装 安装npm软件包: npm install --save screen-size-vue # OR yarn add screen-size-vue 在您的main.js中添加Vue插件: ...
javascript中获得屏幕中和浏览器中所有的尺寸方法 很全很细 包你满意 欢迎下载
获取屏幕的尺寸需要使用Dimensions,直接从node_mules中引入即可。
有兴趣刚需的可以自己下载,非常实用的jquery代码,可以完美运行,有能力的还可以二次修改!
Javascript使用本机Drag'n'drop对每个屏幕尺寸进行重新排序。 安装 仅用于静态定位,包括css/layout-grid.min.css用于订购周围的项目,包括js/layout-grid.min.js 修改 sass/layout-grid.sass允许您为每个屏幕大小...
智能电网智能自适应 Javascript 网格,用于解决几乎任何设备上普遍存在的屏幕尺寸问题
微信小程序 本地图片按照屏幕尺寸处理 前言: 个人感觉微信小程序的IDE用起来有时候不太方便,可能是之前用惯了Eclipse的原因吧。微信小程序的开发工具不支持直接将文件拷贝到目录下,所以首先要将图片文件导入到...
浏览器扩展,供编码人员测量屏幕尺寸。 目前仅适用于Chrome。 从或。 :high_voltage: 寻找在浏览器之外可以使用的更高级的工具? 查看 变更记录 版本2.0.5(2016-10-23) 确保文本方向保持从左到右 版本2(2015-07...
获取屏幕尺寸大小captureScreenSize.getScreenSize(function(point){var screenWidth = point[0];var screenHeight = point[1];},function(){alert('error')});2.获取状态栏(statusbar)的高度...