TweenLite animation does not work with no errors

Question

I tried to use TweenLite to animate some elements, but it didn't work ! The console.log command works, no errors occures, but nothing happens too.

This is the script :

<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

If you want to animate CSS properties with TweenLite JS script, You will need to include the GSAP CSSPlugin separately.

<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>

If you ONLY include the TweenMax JS script, then you don't have to include the CSSPlugin since it is included in TweenMax for convenience.

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

TweenMax includes the following:

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

Hope this helps! :)