1.从简单开始,引入tweenjs文件
<script src="https://code.createjs.com/1.0.0/tweenjs.min.js"> </script>
2.先移除在init函数底部的 stage.update()
在底部的空白区可以放置我们的tweenjs , 首先获取circle实例
(1)将 loop:true 传入,然后我们动画就可以循环播放了。
(2).to() 方法可以让对象移动到一个位置, 并且让其做一些事 (eg:改变x的值可以改变水平位置,改变alpha可以改变透明度)
createjs.Tween.get(circle, {loop:true}) // 循环播放动画 .to({ x: 400}, 1000, createjs.Ease.getPowInOut(4)) .to({ alpha: 0, y: 175 }, 500, createjs.Ease.getPowInOut(2)) .to({ alpha: 0, y: 225 }, 100,) .to({ alpha: 1, y: 200 }, 500, createjs.Ease.getPowInOut(2)) .to({ x: 100 }, 800, createjs.Ease.getPowInOut(2));
3.还记得第二步开始为什么要删除 stage.update() 方法吗? 这是因为tween 有自己的刷新舞台的方式,
(1)设置fps(帧数)
(2)添加事件监听中的ticker类(打点器) ,它会让stage