老师我有点乱

来源:4-1 CSS动画背景知识

MiMicccc

2020-11-23 17:44:50

初始化样式,增加init    A A_init

切换所有animateElements的 init -> done   A A_done

切换所有animateElements的 done -> init   A A_init


这三个状态我有点乱,搞不懂了

页面加载的时候是A_init吗?

页面动画加载完成后样式是A_done吗?

到底什么时候是done 什么时候是init

麻烦老师详细讲解一下,我这里有点混乱了@_@



写回答

2回答

好帮手慕久久

2020-11-24

同学你好,问题解答如下:

1、点击的时候,screen中的三个if只会执行一个,即满足哪个if的条件就会执行哪个。由于每个if语句中写了“return”,它的作用是阻止代码往下继续执行,所以只会执行其中一个if:
http://img.mukewang.com/climg/5fbc60a609f5b57110910565.jpg
2、A_done是指动画结束。页面加载完成,元素类名就是我们在html结构上写的A,第一次点击会给元素添加init类名(初始类名),即A ->A_init;第二次点击,会由A_init->变成A_done,此时元素做动画,即A_done时,元素动画结束。
祝学习愉快!

0
hiMicccc
h 好的谢谢老师
h020-11-25
共1条回复

好帮手慕久久

2020-11-23

同学你好,test.js使用来测试动画效果的,它是通过点击事件来切换元素类名的,具体如下:

页面刚打开时,元素类名就是A,此时并不会添加init类名,即显示的就是普通的静态页;第一次点击页面的时候,会给元素添加init类名,即元素类名由A变成A A_init,此时元素初始化样式;第二次点击,会将类名由A A_init变成A A_done,此时元素会做动画(完成一次动画);当第三次点击时,元素类名会再次变成A A_init,即再次初始化;第四次点击时,元素类名会由A A_init变成A A_done,而第三次点击与第四次点击,让元素又做了一次动画,依次类推。这样就可以实现,通过多次点击,反复让元素做动画,这样有助于我们测试动画是否正确。

祝学习愉快

0
hiMicccc
h 页面加载完成点击一次执行A ->A_init->A_done->A_init A_done 指的是动画的开始还是动画的结束
h020-11-23
共2条回复

0 学习 · 40143 问题

查看课程