一聚教程网：一个值得你收藏的教程网站

ps教程 | flash教程 | 路由器设置 | Jsp教程 | 加入收藏

首页 php教程 asp.net教程 css教程网页制作网页特效手机开发办公数码

当前位置：一聚教程网 > 网页特效 > 页面特效

推荐专题

最新下载

1

雪花秘境
大小：27.28 MB 类型： 休闲养成
2

餐修
大小：42.34 MB 类型： 生活服务
3

年年有鱼
大小：67.58 MB 类型： 益智休闲
4

境界勇士九游版
大小：14.10 MB 类型： 策略塔防
5

淘车位停车
大小：22.41 MB 类型： 生活服务
6

仙魔大战
大小：123.25 MB 类型： 角色扮演
7

爱迪收
大小：33.31 MB 类型： 生活服务
8

人鱼公主美妆秀
大小：97.20 MB 类型： 休闲养成
9

店铺装修宝
大小：18.92 MB 类型： 商务办公
10

知城优聘
大小：131.16 MB 类型： 生活服务

热门教程

1

乐视超级手机1s开启USB调试模式教程
时间：2015-11-13 类型： 手机软件
2

解决IDEA springboot"spring-boot-maven-plugin"报红问题方法
时间：2021-04-16 类型： Java技巧及代码
3

字母圈是什么梗字母圈什么意思
时间：2020-01-13 类型： 互联网加
4

苹果版的avnight卡播放面问题解决
时间：2018-01-26 类型： 手机软件
5

豪绅的钱如数奉还百姓的钱三七分成是什么梗豪绅的钱如数奉还百姓的钱三七分成是什么意思
时间：2022-04-25 类型： 互联网加
6

反差婊是什么梗反差婊是什么意思
时间：2020-04-27 类型： 互联网加
7

微信键盘打字看不到字解决办法
时间：2023-04-18 类型： 手游攻略
8

生异形吗你们哥俩是什么梗生异形吗你们哥俩是什么意思
时间：2021-08-25 类型： 互联网加
9

番茄畅听金币提醒关闭方法
时间：2023-10-31 类型： 手游攻略
10

《伪人测试》网页版入口一览
时间：2022-12-30 类型： 手游攻略

javascript获取屏幕/显示器分辨率，以及各种高宽的检测

时间：2013-08-02 编辑：简简单单来源：一聚教程网

提示：您可以先修改部分代码再运行

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>javascript获取屏幕/显示器<a href="http://www.111com.net/zhuanti/fenbianlv/" target="_blank">分辨率</a>，以及各种高宽的检测</title>
<style>
*{padding:0;margin:0;font-size:12px;font-family:Arial}
#content{padding:10px;background:#FFCC00;float:left}
b{color:red}
</style>
</head>

<body>
<div id="content"></div>

<script type="text/javascript">
function showWidth(){
    var  s = " ";
    s += "<p>网页可见区域宽："+ document.body.clientWidth;
    s += "</p><p>网页可见区域高："+ document.body.clientHeight;
    s += "</p><p>网页可见区域宽："+ document.body.offsetWidth + "　(包括边线和滚动条的宽)";
    s += "</p><p>网页可见区域高："+ document.body.offsetHeight + "　 (包括边线的宽)";
    s += "</p><p>网页正文全文宽："+ document.body.scrollWidth;
    s += "</p><p>网页正文全文高："+ document.body.scrollHeight;
    s += "</p><p>网页被卷去的高："+ document.body.scrollTop;
    s += "</p><p>网页被卷去的左："+ document.body.scrollLeft;
    s += "</p><p>网页正文部分上："+ window.screenTop;
    s += "</p><p>网页正文部分左："+ window.screenLeft;
    s += "</p><p><b>屏幕分辨率的宽："+ window.screen.width;
    s += "</b></p><p><b>屏幕分辨率的高："+ window.screen.height;
    s += "</b></p><p>屏幕可用工作区高度："+ window.screen.availHeight;
    s += "</p><p>屏幕可用工作区宽度："+ window.screen.availWidth;
    s += "</p><p>你的屏幕设置是"+ window.screen.colorDepth   + "   位彩色 ";
    s += "</p><p>你的屏幕设置"+ window.screen.deviceXDPI   + "   像素/英寸 </p>";
    document.getElementById('content').innerHTML = s;
}
window.onload = function(){
    showWidth();
}
window.onresize = function(){
    showWidth();
}
window.onscroll = function(){
    showWidth();
}
</script>

</body>
</html></td>
	  </tr>
	</table>

提示：您可以先修改部分代码再运行

上一个：原生js日历插件 js日历效果
下一个： js 滚动条控件滚动至底部特效

相关文章

热门栏目