CSS之window的视图属性

2024-05-19 15:52:57

1. innerWidth 属性和innerHeight 属性

innerWidth获取浏览器窗口宽度，注意不带浏览器的边框宽度，但是包括下拉按钮的宽度

innerHeight获取浏览器窗口高度，从浏览器底部到工具栏的距离，注意不包括工具栏的高度

innerWidth和innerHeight属性只读，没有默认值

2. outerWidth属性和outerHeight属性

outerWidth是浏览器窗口包含浏览器边框的宽度

outerHeight是浏览器窗口从浏览器上边框到下边框的高度

outerWidth和outerHeight属性只读，没有默认值

3.pageXOffset和pageYOffset

pageXOffset和pageYOffset返回整个页面水平和垂直方向的滚动距离

pageXOffset 设置或返回当前页面相对于窗口显示区左上角的 X 位置

pageYOffset 设置或返回当前页面相对于窗口显示区左上角的 Y 位置

初始页面：

滑动后页面：将上部分内容滑动消失

点击按钮查看pageYOffset:

4.screenX and screenY

浏览器窗口在显示器中的位置，screenX表示水平位置，screenY表示垂直位置

screenY返回的是浏览器窗口顶部到显示器顶部的距离

screenX返回的是浏览器窗口的左边(从左边框开始)到显示器的右边的距离

CSS之window的视图属性相关推荐

2.CSS Transforms 三维 HTML新增属性
CSS Transforms 三维 transform-style 概念:该属性设置元素的子元素是位于 3D 空间中还是平面中.可选值: flat: 设置元素的子元素位于该元素的平面中. preser ...
js的window对象与属性的使用
1.BOM的概述 browser object modal :浏览器对象模型. 浏览器对象:window对象. Window 对象会在 <body> 或 <f ...
float属性html,详解CSS样式中的float属性
详解CSS样式中的float属性.float是 css 样式的定位属性.我们在印刷排版中,文本可以按照需要围绕图片.一般把这种方式称为"文本环绕".在网页设计中,应用了CSS的fl ...
SAP EWM - 物料主数据 - EWM系统库存规划 - SLOTTING视图属性
SAP EWM - 物料主数据 - EWM系统库存规划 - SLOTTING视图属性 http://blog.itpub.net/29829936/viewspace-2565423/ 该页签用于存储 ...
SAP EWM - 物料主数据 - EWM系统存储视图属性
SAP EWM - 物料主数据 - EWM系统存储视图属性 https://mp.weixin.qq.com/s/vyNu6EnyBQFGTaT7lsUxwQ 该视图主要用于保存如何存储产品的信息参数 ...
SAP EWM - 物料主数据 - EWM系统包装视图属性
SAP EWM - 物料主数据 - EWM系统包装视图属性 https://mp.weixin.qq.com/s/ei3G_xhLnvWMcTVTB2RIsg 该页签用于保存产品主数据在打包至HU时的 ...
css盒子子类继承父类哪些,css不继承父类的属性有哪些
css不继承父类的属性有:display.width.height.margin .border.float.clear.position.top.right.bottom.left.backgrou ...
css超出一行添加省略号属性
css超出一行添加省略号属性:text-overflow和white-space 转自:http://caibaojian.com/css-white-space.html 通过使用text-over ...
视图属性+对象动画组件ViewPropertyObjectAnimator
视图属性+对象动画组件ViewPropertyObjectAnimator ViewPropertyObjectAnmator组件是一款对象动画(ObjectAnimator)封装组件.它将视图属性动 ...

最新文章

热门文章