元素滚动scroll系列（附实例、图解）

1. 元素滚动scroll系列属性

scroll翻译过来就是滚动，我们使用scroll系列的相关属性可以动态的得到该元素的大小、滚动距离等。

属性详解

element.scrollTop

返回被卷去的上侧距离，返回数值不带单位

element.scrollLeft

返回被卷去的左侧距离，返回数值不带单位

element.scrollWidth

返回自身实际宽度，不含边框，返回数值不带单位

element.scrollHeight

返回自身实际高度，不含边框，返回数值不带单位

2. 页面被卷去的头部

如果浏览器的高（或宽）度不足以显示整个页面，会出现滚动条，当滚动条向下滚动时，页面上面被隐藏掉的高度，我们就成为页面被卷去得头部，滚动条在滚动时会触发onscroll事件

 //scroll滚动事件：当我们滚动条发生变化会触发的事件
    div.addEventListener('scroll', function(){
        console.log(div.scrollTop);
    })