TweenLite动画无法正常工作

Question

我试图使用TweenLite为一些元素设置动画，但它不起作用！ console.log命令有效，没有错误发生，但没有任何反应。

这是脚本：

<script type="application/javascript"> 
    window.onload = function(){ 
     var back = document.getElementById("back"); 
     var table = document.getElementById("table"); 

     console.log(table); 
     //TweenLite.to(table,4,{top:"4500px" , height:"0px"}); 
     TweenLite.to(table,4,{top:"4500"}); 
     TweenLite.to(back, 1.5, {width:100}); 
    }; 
</script> 

Answer 1

如果你想与TweenLite JS脚本动画CSS属性，您将需要包括GSAP CSSPlugin分开。

<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.13.2/TweenLite.min.js"></script> 
<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.13.2/plugins/CSSPlugin.min.js"></script> 

如果只包括TweenMax JS脚本，那么你不必包括CSSPlugin因为它包含在TweenMax为了方便。

<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.13.2/TweenMax.min.js"></script> 

TweenMax包括以下内容：

• CSSPlugin
• RoundPropsPlugin
• BezierPlugin
• AttrPlugi
• DirectionalRotationPlugin
• EasePack
• TimelineLite
• TimelineMax

希望这有助于！ :)