JS判断元素是否在可视区域

JavaScript014

JS判断元素是否在可视区域,第1张

释义： Element.getBoundingClientRect() 方法返回元素的大小及其相对于视口的位置。

如果是标准盒子模型，元素的尺寸等于width/height + padding + border-width的总和。

如果box-sizing: border-box，元素的的尺寸等于 width/height。

scorll滑动的距离>=当前元素距离浏览器最顶端的高度+当前元素自身的高度-当前可视区的高度

scorll滑动的距离>=当前scroll总高度-当前可视区的高度

var top = obj.getBoundingClientRect().top //元素顶端到可见区域顶端的距离

var se = document.documentElement.clientHeight //浏览器可见区域高度。

if(top <= se ) {

//code

}