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

希望這有助於！ :)