关于动画延迟

关于动画延迟

# 具体遇到的问题
我在第三页设置的动画如果不设置延迟时间,当页面滚动到第三页时动画已经自动结束了

但是如果延迟时间设置太久,可能存在等待很久才出现动画的情况,请问这个问题应该如何解决?



正在回答

登陆购买课程后可参与讨论,去登陆

2回答

同学你好,使用keyframes道理是一样的。只要在done类名中,给元素添加keyframes动画,理论上也不会出现同学说的问题。因为只有切换到第三页时,该页元素才会添加done类名,而keyframes动画是在done类名中,那么即使设置了延时,也会在类名变成done的时候开始计时,计时时间到,动画再执行。而不会出现还没滑到该页,该页动画就开始执行了。

祝学习愉快!

好帮手慕久久 2020-12-30 15:21:08

同学你好,作业要求页面滚动到第三页,第三页元素才开始做动画。实现思路是:在滚动事件中,利用页面滚动的距离,来判断是否滚动到第三页。如果滚到到第三页,就将该页元素的类名,由init变成done;类名变化后,元素的样式会改变,只要添加过渡属性,就会有动画效果(页面滚动到该屏,该屏元素才改变类名从而做动画)。因此,设不设置延时,理论上并不影响整体效果(不会出现同学说的问题)。由于不知道同学具体是怎么写的代码,因此很难给同学解决方案。建议同学将视频中,讲解的宣传页项目再学一遍,只要把视频中的项目学会,这个页面是一样的,按照宣传页的实现方式来写这个作业即可。听不懂的地方,可以在问答区提问,老师会给同学讲解,帮助同学学懂。

另外,写完作业后,可以把作业提交,批复作业的老师,会根据同学的代码,来给同学修改和优化呦。

祝学习愉快!

  • 提问者 蛋挞狂魔 #1

    我使用的不是transition,是keyframes, 不知道是不是这个原因?

    2020-12-30 15:25:32
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师