日常捕获的野生知识 - javascript获取屏幕大小
刚刚接触JavaScript，涉及到 document , window 的一些基本知识不是很了解，今天为了一个屏幕大小折腾了半天，幸好找到了很好的例子学习。
代码如下：
<html>
<script>
function al(){
document.write(
"屏幕分辨率为："+screen.width+"*"+screen.height //最好是window.screen
+"<br />"+
"屏幕可用大小："+screen.availWidth+"*"+screen.availHeight
+"<br />"+
"网页可见区域宽："+document.body.clientWidth
+"<br />"+
"网页可见区域高："+document.body.clientHeight
+"<br />"+
"网页可见区域宽(包括边线的宽)："+document.body.offsetWidth
+"<br />"+
"网页可见区域高(包括边线的宽)："+document.body.offsetHeight
+"<br />"+
"网页正文全文宽："+document.body.scrollWidth
+"<br />"+
"网页正文全文高："+document.body.scrollHeight
+"<br />"+
"网页被卷去的高："+document.body.scrollTop
+"<br />"+
"网页被卷去的左："+document.body.scrollLeft
+"<br />"+
"网页正文部分上："+window.screenTop
+"<br />"+
"网页正文部分左："+window.screenLeft
+"<br />"+
"屏幕分辨率的高："+window.screen.height
+"<br />"+
"屏幕分辨率的宽："+window.screen.width
+"<br />"+
"屏幕可用工作区高度："+window.screen.availHeight
+"<br />"+
"屏幕可用工作区宽度："+window.screen.availWidth
);
}
</script>
<body onLoad="al()" >
</body>
</html>
简单但是实用，记录一下。
日常捕获的野生知识 - javascript获取屏幕大小的更多相关文章
- 日常捕获的野生知识 - javascript 与 类
javascript 并不提供类这样方便实用的面向对象类型,今天学习到了,直接上代码: <!DOCTYPE html> <html lang="en"> & ...
- JavaScript获取屏幕和页面的宽度和高度
JavaScript获取屏幕和页面的宽度和高度 1.设计源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN ...
- js获取屏幕大小
1.js获取屏幕大小 <html> <script> function a(){ document.write( "屏幕分辨率为:"+screen.widt ...
- 转：VC++获取屏幕大小第一篇 像素大小GetSystemMetrics
VC++获取屏幕大小第一篇 像素大小 GetSystemMetrics>和<VC++获取屏幕大小第二篇物理大小GetDeviceCaps 上>和<VC++获取屏幕大小第三篇物理 ...
- wift - 使用UIScreen类获取屏幕大小尺寸
UISreen类代表了屏幕,开发中一般用来获取屏幕相关的属性,例如获取屏幕的大小. 1 2 3 4 5 6 7 //获取屏幕大小 var screenBounds:CGRect = UIScreen. ...
- Android 获取屏幕大小和密度
Android 获取屏幕大小和密度 DisplayMetrics metric = new DisplayMetrics(); getWindowManager().getDefaultDisplay ...
- cocos2d-x JS 获取屏幕大小或中点
以一张背景图为例: var HelloWorldLayer = cc.Layer.extend({ ctor:function () { this._super(); var bg = new cc. ...
- Android获取屏幕大小和设置无标题栏
android获取屏幕大小非常常用,例如写个程序,如果要做成通用性很强的程序,适用屏幕很强,一般布局的时候都是根据屏幕的长宽来定义的,所以我把这个总结一下,方便日后忘记的时候查阅.还有就是有时候写程序 ...
- 绘制bitmap 全屏 安卓获取 屏幕大小
韩梦飞沙 韩亚飞 313134555@qq.com yue31313 han_meng_fei_sha 绘制bitmap 全屏 Rectf rectF = new RectF(0, 0, w, ...
随机推荐
- python学习，day1作业：设计一个三级菜单
设计一个三级菜单,要求能够下钻,能够推出,比较笨的方法 # coding=utf-8 # Author: RyAn Bi data = { 'beijing':{ 'changping':{ 'wud ...
- jmeter安装部署、maven路径配置
jmeter下载地址: https://jmeter.apache.org/download_jmeter.cgi 解压文件 配置jmeter环境变量 (1)设置jmeter解压目录的JMETER_H ...
- oracle--块信息深入解析
一,创建 Data Block是数据库中最小的I/O单元 01,建立一个新的表空间 查看默认表空间位置 select TABLESPACE_NAME,FILE_NAME from dba_data_f ...
- Axure原型设计介绍
在第八周的课堂上,王文娟老师在校园系统上发布了对于自行选择的原型设计软件进行资料查找以及自学的任务.因为之前的课程学习需要,我们大概掌握了原型设计软件Axure的使用,下面是一些我们学习过程中的介绍 ...
- js模块加载框架 sea.js学习笔记
seajs实现了JavaScript 的 模块开发及按模块加载.用来解决繁琐的js命名冲突,文件依赖等问题,其主要目的是令JavaScript开发模块化并可以轻松愉悦进行加载. 官方文档:http:/ ...
- jar包读取配置文件
读取jar包内配置文件: Properties config = new Properties(); InputStream in = this.getClass().getClassLoader() ...
- vue 坑之 vuex requires a Promise polyfill in this browser
android内嵌H5页面不显示出现这个问题,原因有很多 首先,别急,请看下面的推荐方案: 1.找个Android真机测试下(机型版本为4.4以上),真机联调测试 Android 只需要四个步骤: 1 ...
- WPF的布局-Grid(表格布局)
1. Grid布局就是表格布局 如下图: 2. 使用方法 2.1. 先生成适量的行和列,代码如下: <Grid><!--使用Grid控件--> <Grid.ColumnD ...
- React.js 小书 Lesson24 - PropTypes 和组件参数验证
作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson24 转载请注明出处,保留原文链接和作者信息. 我们来了到了一个非常尴尬的章节,很多初学的朋友 ...
- 深入redis内部--内存管理
1. Redis内存管理通过在zmalloc.h和zmalloc.c中重写c语言对内存的管理来完成的. redis内存管理 c内存管理 原型 作用 zmalloc malloc void *mallo ...