window.onload / onscroll／onresize 事件

onload當文檔加載完成後執行一些操作
    window.onload = function(){
        console.log("頁面加載完成")
    }

    onscroll當頁面發生滾動時執行一些操作
    window.onload = function(){
        console.log(1)            //當頁面發生滾動時，列印1
    }

    onresize當視窗大小發生改變時執行一些操作
    window.onresize = function(){
        console.log(1)            //當視窗大小發生改變時，列印1
    }
    頁面滾動條距離頂部的距離
    document.documentElement.scrollTop
    頁面滾動條距離左邊的距離
    document.documentElement.scrollLeft


demo： 做一個滾動條      

var obox=document.querySelector(".box1")  //點選的盒子
var t;
obox.onclick=function () {
    t=setInterval(function () {
     var s=document.documentElement.scrollTop-=50    //設定定時器每0.01毫秒減少50
        console.log(document.documentElement.scrollTop)
        if(s<=0){    //減少為0時關閉計時器
            clearInterval(t)
        }
    },10)
}