我想在演示文稿中添加一些简单的动画。我使用 GSAP (TweenMax) 来完成这项工作。我对动画设置没有问题,但是这些动画在演示开始后立即触发。
我如何控制它,以便只有当带动画的幻灯片处于活动状态时脚本才会执行?
欢迎您提供所有帮助。
问候!
EDIT:
嗯,看起来阅读库的文档至少可以回答 90% 的此类问题。
对于懒惰的人(像我一样:))这是我发现的:
要检查幻灯片何时更改,我们使用以下命令:
Reveal.addEventListener( 'slidechanged', function( event ) {
// event.previousSlide, event.currentSlide, event.indexh, event.indexv
} );
在我的 AnimeScript.js 中,我只是链接该事件,就像:
Reveal.addEventListener( 'slidechanged', function( event ) {
myTween();
} );
如果我们想定位特定的幻灯片,我们使用data-state
论据中的<section></section>
标签如:
<section data-state="slide2">
<img id="logo2" src="images/logo.png">
<h2>No Theme</h2>
<p>There's no theme included, so it will fall back on browser defaults.</p>
</section>
并链接 AnimeScript.js 中的状态,如下所示:
Reveal.addEventListener( 'slide2', function() {
myTween();
TweenMax.to(logo3, 1,{opacity:1, delay:1.5});
}, false );
Regards!