JS - 滚动事件(onscroll)

JavaScript07

JS - 滚动事件(onscroll),第1张

当浏览器滚动条滚动时会触发 onscroll 事件,通常情况下指上下滚动条滚动。

需要注意的是,浏览器一旦检测到滚动条发生滚动,就可以触发 onscroll 事件,而无需等到滚动行为结束。

下面的例子演示了一个极普遍的应用:利用 onscroll 事件检测滚动条位置,当向下滚动到一定位置时,在页面右下角会出现“返回顶部”的锚链接,以方便网站用户快速返回顶部。

scroll,滚动,一般讨论的是网页整体与浏览器之间的关系。

这四个属性,全部是只读属性

其中,无非就是分为 宽高 和 左上 。

两个方向。

scrollBy(x,y)方法滚动当前window中显示的文档,x和y指定滚动的相对量。

scrollBy(0, 200) ==>使得滚动条Y轴的位置,在当前的基础上增加200。比如:当前Y轴位置为0,执行后便是200;当前为100,执行后便是300。

scrollTo(xpos,ypos)

scrollTo(x,y)方法:滚动当前window中显示的文档,让文档中由坐标x和y指定的点位于显示区域的

1、首先需要新建一个HTML文档,这里设立一下基本的架构。

2、再新建一个CSS文件,用link关联一下HTML文档。

3、创建DIV标签,并且往里面填充内容。

4、先设定一下滚动条内框的大小。

5、用border先来查看是否有超出,这里可以看出超出了很多内容。

6、overflow-y: scrolloverflow-x: scroll加上这个样式滚动条就会出现了。

7、现在就能对轨道和滚动条进行样式的设置了。