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)
}

复制代码

 

posted @   菜鸟小何  阅读(471)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
阅读排行:
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 零经验选手,Compose 一天开发一款小游戏!
· 一起来玩mcp_server_sqlite,让AI帮你做增删改查!!
点击右上角即可分享
微信分享提示