Saif Elkholy
Saif Elkholy

Reputation: 37

Can't get functions from script tags html

Super new to html but i've been trying to get the function TweenTo(elem,dur,style) from this web script

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

And here is where i'd like to implement that function

 <img id="mainPic" src="mainPic.jpg" style="margin-top:70px;position:relative ! important" class="img-responsive" alt="Responsive image" onclick="startAnimation()">
        <script type="text/javascript">
             function startAnimation(){
                 TweenTo(document.getElementById('mainPic'),1,{width:600px})
             }
        </script>

I am completely lost here as to why i cant run this function when onClick is called on the picture. All help is appreciated thanks :D

Upvotes: 0

Views: 50

Answers (2)

Jaromanda X
Jaromanda X

Reputation: 1

Read the documentation for the library you are using

https://greensock.com/tweenmax

function startAnimation(){
  TweenMax.to(document.getElementById('mainPic'),1,{width:'600px'})
}

Upvotes: 1

Little Santi
Little Santi

Reputation: 8803

There is a syntax error in your code: Remove the dot (.) after TweenTo. Let it like this:

TweenTo(document.getElementById('mainPic'),1,{width:600px})

Moreover: Go find in your navigator the "Error console" for javascript, that will help you a lot finding errors.

Update

There is another, semantic error in your code: According to the TweenMax.min.js script, the function tweenTo begins with a lowercase: Pay attention to letter case when programming in javascript.

Upvotes: 0

Related Questions