Screen width、height、availWidth、availHeight属性

最新推荐文章于 2022-07-13 14:55:05 发布
最新推荐文章于 2022-07-13 14:55:05 发布
阅读量804 收藏 1
点赞数

Screen width、height、availWidth、availHeight属性

Screen width、height、availWidth、availHeight属性
 screen.width
回顶部

功能：声明了显示浏览器的屏幕的宽度，以像素计。

语法：screen.width

 screen.height
回顶部

功能：声明了显示浏览器的屏幕的高度，以像素计。

语法：screen.height

 screen.availWidth
回顶部

功能：声明了显示浏览器的屏幕的可用宽度，以像素计。

语法：screen.availWidth

 screen.availHeight
回顶部

功能：声明了显示浏览器的屏幕的可用高度，以像素计。这个可用高度不包括分配给半永久特性（如屏幕底部的任务栏）的垂直空间。

语法：screen.availHeight

 实例1
回顶部

获取浏览器的宽度、高度、可用宽度、可用高度。

<script type="text/javascript">
document.write( "屏幕宽度："+ screen.width+"px<br />" );
document.write( "屏幕高度："+ screen.height+"px<br />" );
document.write( "屏幕可用宽度："+ screen.availWidth+"px<br />" );
document.write( "屏幕可用高度："+ screen.availHeight+"px" );
</script>

这段代码的效果为：

屏幕宽度：1440px
屏幕高度：900px
屏幕可用宽度：1440px
屏幕可用高度：870px

网页可见区域宽： 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

z23578355
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
js获取浏览器高度 窗口高度 元素尺寸 偏移属性的方法
11-27
如下所示： screen.width screen.height screen.availHeight //获取去除状态栏后的屏幕高度 screen.availWidth //获取去除状态栏后的屏幕高度 一、通过浏览器获得屏幕的尺寸 二、获取浏览器窗口内容的尺寸 //高度 window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight //宽度 window.innerWidth || document.documentElement.clientWidth || docum
width，availWidth，screenWidth,
kalinux的博客
09-12 1161
 $("#btn").offsetWidth                  返回元素自身宽度（不含border,padding)                    无px 单位  ; $("#btn").offsetLeft         对于利用position定位的，是它的left值         无px; $("#btn").style.width      返回元素自身宽度...
7种Height的比较：screen.height, screen.availHeight, window.innerHeight, window.outerHeight....
Sarahapy的博客
06-30 4105
这7种高度的基本含义： screen.height：用户屏幕高度 screen.availHeight：用户屏幕可用高度，减去了窗口工具值类的界面特征 window.innerHeight：浏览器窗口的视口高度，包括水平滚动条 window.outerHeight：浏览器窗口外部高度 document.body.offsetHeight：文档中 body 部分的高度 document.documentElement.clientHeight：文档可显示区域的高度 document.documentElem
获取屏幕宽高度与可视区域宽高度（availWidth、clientWidth、width、innerWidth）
weixin_30535167的博客
09-30 689
　　经常会遇到需要获取屏幕宽度、高度，可视区域宽度、高度等问题，也就常跟这几个打交道，一不小心，还真爱弄混淆了。 　　先来列举下这几个吧： 　　screen.availHeight、screen.availWidth； 　　screen.height、screen.width； 　　document.documentElement.clientWidth、document.document...
width、clientWidth、offsetWidth、scrollWidth、availWidth
u012006632的博客
01-21 487
width 用于样式表；带单位 .style.width无法返回值offsetWidth 元素内容实际高度 数字 包括滚动条等边线 .offsetWidth = width+padding+border;clientWidth 元素内容可视区域的宽度 数字 不包括滚动条等边线 .offsetWidth = width+padding;srcollWidth chrome 元素正文全文
screen.html
11-15
alert('当前窗口的实际大小为：'+screen.height+":"+screen.width+'\n'+'当前窗口的可视大小为：'+screen.availHeight+":"+screen.availWidth); </body>
JavaScript中的Screen屏幕对象
12-09
screen 屏幕对象 反映了当前用户的屏幕设置。 width 返回屏幕的宽度（像素数）。 height 返回屏幕的高度。 availWidth 返回屏幕的可用宽度（除去了一些不自动隐藏的类似任务栏的东西所占用的宽度）。 ...
JavaScript入门教程(5) js Screen屏幕对象
12-11
screen 屏幕对象 反映了当前用户的屏幕设置。 width 返回屏幕的宽度（像素数）。 height 返回屏幕的高度。 availWidth 返回屏幕的可用宽度（除去了一些不自动隐藏的类似任务栏的东西所占用的宽度）。 availHeight ...
Js获取客户端信息
03-05
document.write(screen.width + "*" + screen.height) document.write(" ") document.write("Available view area: ") document.write(screen.availWidth + "*" + screen.availHeight) document.write(" ...
js得到屏幕宽高、页面宽高 (window.screen.availHeight)
晓风揽月
01-11 5902
js得到屏幕宽高、页面宽高 (window.screen.availHeight) window.screen.availWidth          返回当前屏幕宽度(空白空间)  window.screen.availHeight         返回当前屏幕高度(空白空间)  window.screen.width                  返回当前屏幕宽度
screen.availWidth 与 window.innerWidth（浏览器窗口尺寸、可用屏幕尺寸）
dibengcheng6179的博客
01-23 827
Window 尺寸 有三种方法能够确定浏览器窗口的尺寸（浏览器的视口，不包括工具栏和滚动条）。 对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari： window.innerHeight - 浏览器窗口的内部高度 window.innerWidth - 浏览器窗口的内部宽度 对于 Internet Explore...
javascript获取屏幕、窗口、元素等的大小
weixin_42291355的博客
11-18 1085
javascript获取屏幕、窗口、元素等的大小 一. 屏幕大小 ​ 什么是屏幕大小？屏幕大小是指当前所用设备的屏幕的分辨率（浏览器窗口外部显示器的大小），它一般是不变的。它们可以通过javaScript中screen对象的属性获取。 screen.height: 屏幕的像素高度 screen.width： 屏幕的像素宽度 screen.availHeight: 屏幕的可用工作区的像素高度（即屏幕的像素高度减去系统部件高度之后的值） screen.availWidth: 屏幕的可用工作区的像素宽度（即
【java web】window.screen.availWidth 是个值
qq_43259305的博客
07-23 694
问题如下：loop 出用到了window.screen.avilWidth 和 .avilHeight 但是并没有达到预想的效果 <script> function load(){ document.body.style.width = window.screen.availWidth; document.body.style.height =window.scr...
HTML精确定位:scrollLeft,scrollWidth,clientWidth,offset
deng131的专栏
05-18 179
在html中，任何一个元素都有三个表示位置和大小的对象：client,offset和scroll，每个对象都有相应的 height，width,top,left属性，那么这些究竟有什么区别呢？ client属性是指一个元素直接可以看得到不包括边框的区域，所谓的直接可以看得到不包括边框是这样的概念：不包括滚动条占据的空间（实际上，如果出现了滚动条，元素的高度不会发生变化，clientH...
网页Screen width、height、availWidth、availHeight属性
weixin_30546933的博客
09-22 217
*screen.width 　　功能：声明了显示浏览器的屏幕的宽度，以像素计。 　　语法：screen.width *screen.height 　　功能：声明了显示浏览器的屏幕的可用宽度，以像素计。 　　语法：screen.availWidth *screen.availWidth 　　功能：声明了显示浏览器的屏幕的可用宽度，以像素计。 　　语法：screen.a...
CSS之Screen视图属性
tian361zyc的博客
06-07 1397
CSS
window.screen.availWidth
weixin_58414196的博客
07-05 673
window.screen.availWidth
screenWidth、clientWidth、offsetWidth、 scrollWidth的区别
星河梦~的博客
07-13 2138
screenWidth、clientWidth、offsetWidth、 scrollWidth的区别
function selimage() { window .open( "upload/preUpload.action", "", "toolbar=no,location=no,directories=no,status=no,menubar=no,resizable=yes,copyhistory=no,scrollbars=yes,width=400,height=240,top=" + (screen.availHeight - 240) / 2 + ",left=" + (screen.availWidth - 400) / 2 + ""); } function savefile() { window .open( "upload/preFiles.action", "", "toolbar=no,location=no,directories=no,status=no,menubar=no,resizable=yes,copyhistory=no,scrollbars=yes,width=400,height=240,top=" + (screen.availHeight - 240) / 2 + ",left=" + (screen.availWidth - 400) / 2 + ""); }解析本段代码
最新发布
05-11
这段代码定义了两个JavaScript函数：selimage和savefile。这两个函数都使用window.open()方法打开一个新...其中，垂直居中的位置计算为(screen.availHeight-240)/2，水平居中的位置计算为(screen.availWidth-400)/2。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值