当前位置: 首页 > 面试题库 >

CSS3动画完成时是否有回调?

骆文华
2023-03-14
问题内容

在css3动画的情况下,有什么方法可以实现回调函数?如果使用Javascript动画,则可能会在CSS3中找到实现它的方法,但找不到任何方法。

我可以看到的一种方法是在动画持续时间之后执行回调,但是并不能确保始终在动画结束后立即调用它。这将取决于浏览器UI队列。我想要一个更强大的方法。有什么线索吗?


问题答案:

就在这里。回调是一个事件,因此您必须添加事件侦听器才能捕获它。这是jQuery的一个示例:

$("#sun").bind('oanimationend animationend webkitAnimationEnd', function() { 
   alert("fin") 
});

还是纯js

element.addEventListener("webkitAnimationEnd", callfunction,false);
element.addEventListener("animationend", callfunction,false);
element.addEventListener("oanimationend", callfunction,false);


 类似资料:
  • 问题内容: 我想淡出一个元素(将其不透明度转换为0),然后在完成后从DOM中删除该元素。 在jQuery中,这很简单,因为您可以指定动画完成后要执行的“删除”操作。但是,如果我希望使用CSS3过渡进行动画处理,是否可以知道过渡/动画何时完成? 问题答案: 对于过渡,您可以使用以下内容通过jQuery检测过渡的结束: 对于动画,它非常相似: 请注意,您可以将所有浏览器前缀的事件字符串同时传递到bin

  • 问题内容: 我正在使用AngularJS,并希望在动画制作完成后得到通知。我知道可以使用像这样的javascript定义的动画来完成此操作,但是我很好奇我是否可以不用javascript来做到这一点。 问题: 是否可以使用角度 ng-enter 和 ng-leave css- transitions并指定完成的回调?我猜该事件已被触发,因此应该有一种方法可以执行此操作。 我有这个: HTML: C

  • 问题内容: 是否可以在不使用Javascript的情况下在页面加载时使用CSS3过渡动画? 问题答案: 您 可以 在页面加载时运行 CSS 动画,而无需使用任何JavaScript;您只需要使用 CSS3关键帧即可 。 让我们看一个例子… 这是仅使用 CSS3 的导航菜单滑入位置的演示: 分解… 这里的重要部分是关键帧动画,我们称之为… …这基本上是说:“开始时,标题将离开屏幕的左侧边缘的整个宽度

  • #animated_div{ width:76px; height:47px; background:#92B901; color:#ffffff; position:relative; font-weight:bold; font-size:20px; padding:10px; animation:animated_div 5s 1;

  • 每当此动画结束时,我都会尝试调用一个方法,但在某些情况下,例如,当用户离开应用程序时,它的完成块永远不会被调用。此外,当VC与UIView动画同时出现时,完成块永远不会被调用。 即使动画以某种方式中断,我应该如何确保调用回调?我是否应该根本不使用UIView动画完成块,而是使用其他内容?请开导我。。!

  • 问题内容: 我需要在某些文本上执行一系列动画处理,并且我打算使用CSS3。我的计划是使一些文本缓慢地在屏幕上向下移动,并到达屏幕的特定部分后,某些单词将被突出显示,最终文本将继续在屏幕上向下移动并消失,为进一步的文本留出空间。 我的问题是,“链接”这些动画的最佳方法是什么。我是否应该有一个用于向下移动屏幕的动画,一个用于突出显示文本的单独动画以及一个用于向下移动屏幕其余部分的动画?然后,是否应该将