滚动的简析

        在滚动中,当父对象里面的东西超出父对象的内容区域,则父对象就会出现滚动,任何对象都可以滚动。

滚动的方法

window.scroll(x,y)  此方法接收两个参数,依次为X坐标和Y坐标;设置滚动条的偏移位置

滚动的简析_第1张图片

 

使用window.scroll(x,y)滑动滚动,打印出来结果如下

滚动的简析_第2张图片
window.scrollTo(x,y) 此方法和scroll()作用一样

 滚动的简析_第3张图片

使用window.scroll(x,y)滑动滚动,打印出来结果如下

滚动的简析_第4张图片

window.scrollBy(bx,by) 此方法同样接收两个参数,表示在以前基础出的增加。

滚动的简析_第5张图片

使用window.scrollBy(bx,by)方法,打印结果如下

滚动的简析_第6张图片

内容的收缩和展开

window.pageYOffset, bom操作,IE8及IE8以下不兼容,标准与混杂模式都可用

滚动的简析_第7张图片

打印出来的效果如下:

滚动的简析_第8张图片滚动的简析_第9张图片

 自动滚动

document.body.scrollTop ,仅混杂模式可用

document.body.scrollLeft ,仅混杂模式可用

滚动的简析_第10张图片

自动移动打印出位置 如下

滚动的简析_第11张图片

 

你可能感兴趣的:(前端,javascript)