JavaScript(offset、scroll、client) 客官°小女子只卖身不卖艺 2022-05-11 01:06 153阅读 0赞 在<style></style>标签中设置的样式属性 无法通过 style 获取, 是通过offset系列 ### offset:获取当前元素的宽高 ### offsetWidth 获取元素的宽 (包括padding 、border) offsetHeight: 获取元素的高 (包括padding 、border) offsetTop 获取当前元素距离页面顶部距离 offsetLeft: 获取当前元素距离页面左端距离 **offsetX ** 相对于整个页面的横坐标 **offsetY ** 相对于整个页面的纵坐标 ### scroll:获取滚动条的滚动事件 以及卷曲: ### scrollWidth : 元素中内容的实际宽 (+padding) scrollHeight: 元素中内容的实际高 (+padding) scrollTop : 向上 卷曲出去的值 scrollLeft: 向 左卷曲出去的值 **scrollTop == pageYOffset**( window对象) **scrollLeft = =pageXOffse**t ( window对象) 注意: 滚动事件(onscroll)有三个对象, 分别是window ,html ,body 浏览器的滚动事件 window.pageYOffset IE8不支持 页面的滚动事件 document.documentElement.scrollTop body的滚动事件 doucment.body .scrollTop 鼠标滚轮事件 window.onmousewheel ### client:获取可视区宽高 ### clientWidth:可视区的宽度 clientHeight:可视区的高度 clientLeft:鼠标距离左边的值 clienTop:鼠标上边框的值 clientX 可视区域的横坐标 clientY 可视区域的纵坐标 鼠标移动事件( document.onmousemove) 鼠标距离页面顶部的距离 pageX =scrollLeft + clientX 鼠标距离页面左端的距离 pageY = scrollTop + clientY 鼠标在屏幕上的横坐标 **screenX **最大值不会超过屏幕分辨率。 鼠标在屏幕上的纵坐标 **screenY** 注意:元素的margin-left /margin-top会影响鼠标所在的位置,要加减margin的值 (e 谷歌,火狐支持 ,IE8支持window.event)
还没有评论,来说两句吧...