CODEWITHSUNDEEP
javascriptjquerygsap
user2903934
user2903934

Reputation: 59

GreenSocks Tweenmax animation

I am new to Tweenmax animation and i am trying to animate an id selector and unfortunately nothing is happening. both selector and content do nothing. Some one help me out, here is the code.

<!DOCTYPE html>
<html>
    <head>
        <title>my first tween</title> 

        <style>
            body {
                background-color:silver;
            }

            #sample {
                width: 402px;
                height: 60px;
                background-color:teal;
                padding: 8px;
            }
        </style>    

        <script type="text/javascript" src="jquery.gsap.js"></script>
        <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.11.6/TweenMax.min.js">/script>
    </head>

    <body>
        <div id="sample">
            <!-- Some content -->
        </div>
    </body>
</html>

And here is the js

var drew = document.getElementById("sample"); //or use jQuery's $("#sample")
TweenLite.to(sample, 1.5, {width:100});

Upvotes: 1

Views: 1104

Answers (2)

Dhaval Panchal
Dhaval Panchal

Reputation: 648

use

  var drew = document.getElementById("sample"); //or use jQuery's $("#sample")
  TweenLite.to(drew , 1.5, {width:100});

you put sample instead of drew.

Upvotes: 0

Mario Gonzales Flores
Mario Gonzales Flores

Reputation: 705

<script>
    $(function(){
        TweenLite.to($("#sample"), 1.5, {width:100});
    });
</script>

Upvotes: 1

Related Questions