0
点赞
收藏
分享

微信扫一扫

JavaScript学习笔记(四)

毅会 2022-02-15 阅读 44

目录

四、PC端网页特效

1. 元素偏移量offset

2. 元素可视区client系列

2.1 client系列属性

3. 元素滚动scroll系列

3.1 scroll属性


四、PC端网页特效

1. 元素偏移量offset

1.1 offset属性

element.offsetParent       返回作为该元素带有定位的父级元素如果父级都没有定位则返回body
element.offsetTop            返回元素相对带有定位父元素上方的偏移
element.offsetLeft            返回元素相对带有定位父元素左边框的偏移
element.offsetWidth         返回自身包括padding、边框、 内容区的宽度,返回数值不带单位
element.offsetHeight        返回自身包括padding、边框、内容区的高度,返回数值不带单位

2. 元素可视区client系列

2.1 client系列属性

element.clientTop          返回元素上边框的大小
element.clientLeft          返回元素左边框的大小
element.clientWidth       返回自身包括padding、内容区的宽度, 不含边框,返回数值不带单位
element.clientHeight      返回自身包括padding、内容区的高度, 不含边框,返回数值不带单位

立即执行函数:不需要调用,立马执行

(function(){})()     或者      (function(){}())

3. 元素滚动scroll系列

3.1 scroll属性

element.scrollTop             返回被卷去的上侧距离,返回数值不带单位
element.scrollLeft             返回被卷去的左侧距离,返回数值不带单位
element.scrollWidth          返回自身实际的宽度,不含边框,返回数值不带单位
element.scrolHeight         返回自身实际的高度,不含边框,返回数值不带单位

如果是想得到页面被卷去的高度,用:window.pageYOffset,element.scrollTop得到的是盒子卷去的高度。

mouseenter\mouseleave     没有冒泡效应

mousedown\mouseup\mouseover    有冒泡效应,子盒子也会触发事件

举报

相关推荐

0 条评论