Jump to content
GreenSock

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

Conflict between JQuery's animate fn and GSAP

Recommended Posts

I see that GSAP hijacks JQuery's animate function, but this is causing issues with existing code that I have. For example:

$(".object").live("click", function () {
    $(this).animate({
        opacity: 0
    }, function () {
        console.log($(this));
        $(this).slideUp();
    });
});

How it operated before GSAP:

Click on the object, it animates it's opacity down to 0 and then slides up once the opacity animation is done.

 

After GSAP:

It animates its opacity down to 0, but then fails to run the slideUp. I used a console.log of what $(this) is in the callback - before GSAP, its a JQuery object, but afterwards its some new GSAP object that can't itself be animated. I then get an error:

Uncaught TypeError: Cannot read property 'defaultView' of undefined

 

 

I don't want to go through all of my code and change things to fit GSAP - how can I either fix this, or stop GSAP hijacking JQuery's animate plugin?

Link to post
Share on other sites

What version of jQuery are you using? It appears live() was deprecated in 1.7

 

It would really help if you could provide a sample that we can test so that we know exactly what files (and versions) you are using. CodePen works great for this as it allows us to edit the exact files you produce and most often fix them. More details on how to do that here:

http://forums.greensock.com/topic/9002-read-this-first-how-to-create-a-codepen-demo/

 

Also please note that GSAP ONLY hijacks animate() when you load the jquery.gsap.js file as mentioned here: http://www.greensock.com/jquery-gsap-plugin/#

 

If there is a particular animation that isn't cooperating with GSAP you can pass skipGSAP:true into the animate() method's config object (details on link above).

$(".myClass").animate({scrollTop:200, skipGSAP:true});
Link to post
Share on other sites

Great catch guys. Jamie's fix is in the latest version now. The CDN hasn't updated yet, but you can get it in the zip download or on github (click the "get GSAP" button in the top left of this page). 

  • Like 1
Link to post
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.

×