作者:冭獭1314 | 来源:互联网 | 2022-10-11 18:08
本文实例为大家分享了js回调函数仿360开机的具体代码,供大家参考,具体内容如下
关键代码:
1、demo(最外面整个大盒子)的定位
固定定位,放在页面的右下方
span(关闭按钮)绝对定位在demo的右上方:
#demo{
width:322px;
position : fixed;
bottom:0;
right:0;
}
span{
width:30px;
height: 20px;
position:absolute;
top:0;
right:0;
cursor:pointer;
}
2、防止冒泡,因为span(关闭按钮)的父元素是demo, 所以不能直接写 span.onclick , 这样会发生冒泡,相当于点击了父元素demo, 事件会响应在父元素上,所以应该用span的 id 绑定事件
3、回调函数,点击关闭按钮时,首先下面的盒子 高度变成 0 ,然后整个盒子的宽度 变成 0,依次消失 (所以一开始demo 的高度不应该设置,因为下面的盒子消失之后,上面的盒子会掉下来) 回调函数写的位置:定时器结束的位置
close.Onclick=function(){
run(xia, {height:0}, function(){
run(shang,{demo:0}
}
}
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。