Jump to content
GreenSock

Gary

Determine current value?

Go to solution Solved by Gary,

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Is there a way to determine the current value of a property given the element, property, and position in the timeline?

 

I'd like to allow the user of my tool to add some custom animation at any give point, and have the animation use the current value as input.  For example, the width of an image might have changed earlier in the animation, or might even be in the middle of a tween.  I'd like to be able to read exactly what the current value of the width is at a particular time.

 

Possible? 

Link to comment
Share on other sites

 I'd like to be able to read exactly what the current value of the width is at a particular time.

 

 

As long as you know the element, time and property a function like this would work:

 

function getValues(element, time, property){
  tl.pause(time)
  
  $("#console").append("<br> requested property:" + property + " = " + element.style[property]);
  
  
  $("#console").append("<br><br> here are some more properties");
  $("#console").append("<br>left = " + element.style.left)
  //scale, rotation, x, y and others are in _gsTransform object on element
  $("#console").append("<br>rotation = " + element._gsTransform.rotation)
  //look in browser's js console to see all properties of _gsTransform object
  console.log(element._gsTransform);
}

 

http://codepen.io/GreenSock/pen/LoupF?editors=101

 

If you are trying to grab transform values like x, y, scaleX, rotationX etc, you will have to look for those in the elements, _gsTransform object.

  • Like 3
Link to comment
Share on other sites

  • Solution

Perfect!  Thanks, Carl.

Link to comment
Share on other sites

  • 5 years later...

Just wanted to chime in to say that element._gsTransform has moved to element._gsap in newer versions of the library.

Link to comment
Share on other sites

Hey @sysebert and welcome.

 

We do not recommend accessing the _gsap object or any other objects with _ at the start of their name as of GSAP 3. We recommend using the more clean method of gsap.getProperty() in GSAP 3 instead.  

  • Like 2
Link to comment
Share on other sites

Oh snap, yah that looks a lot better than doing stuff like parseInt on the returned value :)

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×