1、把图片显示出来
提示:img
2、把图片位置固定到右下角
参考:position: fixed; right: 0; bottom: 260px;
3、添加滚动条下拉
提示:设置一个空的div层,给这个div设置高度
4、打开页面,图片默认隐藏
提示:display:none
5、下拉滚动条,图片显示,上拉到顶部,图片消失
获取滚动条距离顶部的距离:window.scrollY,然后通过if判断图片是否显示。
6、图片添加动画
透明度从0到1,添加时间间隔
7、对动画执行条件进行判断
当图片满足某个条件的时候,不重复执行动画
8、添加点击图片返回顶部的操作
window.scrollTo(0, 0);返回顶部
9、检查