Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
dougburnett

GSAP Tween not reading PHP Javascript call

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

I'm another Flash guy getting into Javascript with GSAP. I'm making a photo gallery and can't seem to get GSAP tweens to read function parameters when I send them via PHP to my Javascript function. For example, I make a PHP call like this:

 

$imageFile = glob("images/*.*");
echo '<img src="'.$imageFile[1].'" id="thumbPic"
      onmouseover="imageOver(this)" 
      onmouseout="imageOut(this)" 
       />';
 

 

to my Javascript functions like this:

 

 

function imageOver(object) {
    TweenMax.to(object, .5, {width:100, ease:Cubic.easeOut});
}


function imageOut(object) {
    TweenMax.to(object, .5, {width:85, ease:Cubic.easeOut});
}
 

 

When I manually call these functions with the "this" parameter from HTML, it works great. But when I write the same HTML via PHP, it doesn't tween. When I trace the "object" parameter I get the same "HTMLImageElement". I've tried calling the image ID directly by doing this: 

 

 

TweenMax.to("#thumbPic", .5, {width:85, ease:Cubic.easeOut});
 

 

But that doesn't work either. Any thoughts?

Link to comment
Share on other sites

Hmm...tough to say without seeing the problem in context, but are you sure that TweenMax loaded in the php version (before you tried animating)? Are you getting any JavaScript errors at all? 

Link to comment
Share on other sites

Hey Jack! Thanks for the response. Here it is in context.

http://dougburnett.com/gsap-test/

 

The "PHP Images" are not tweening but the "Manual HTML Images" are working just fine.

 

It is loading beforehand because I'm just doing a PHP include. And I'm calling the tween at two different times for testing but still not working. Also not getting any JS errors.

 

Thanks for the help.

Link to comment
Share on other sites

Ha! Nevermind. I updated to the most recent release of GSAP v12 and now it works great. Thanks Jack!

Link to comment
Share on other sites

Ah yes, I bet you had a pre-1.8.0 version because that's when we implemented the auto-css wrapping feature. Previously, you had to put all your css-related properties into a css:{} object in order for GSAP to understand which properties were css-related and should be handed off to CSSPlugin. Glad you got it fixed, although I'm pretty baffled as to why you said it was working with the non-php version of your code. I assume that one was either using a more recent version of GSAP or it was using a css:{} wrapper.

Link to comment
Share on other sites

Yah, it was weird. It was actually written the same way for both. But now it's working perfectly so the new version must of had some extra bonus improvements!

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