Jump to content
Search Community

Very very beginer with GreenSock

julien94270 test

By julien94270
in GSAP

Moderator Tag
 Share
Go to solution Solved by Diaco,

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

julien94270 test

julien94270

Posted
Posted

Hi, 

I just try some stuffs, using GreenSock : 
But I don't understand everything... I mention that I am a very beginer with GS but I try it, because the effects shown
on the website are really nice ! 

 
 
 

The first onComplete:runBlue occurs, just after my first tween.
The second onComplete:scrollAll doesn't seem to work....

Do I forget something ? Why the scroll dosn't seem to run ?

Thanks a lot...may be the answer is simple, but I repeat, I am here to learn GreenSock GSAP :-)
 

Jul
 

 

See the Pen Awrjx by anon (@anon) on CodePen

Link to comment
Share on other sites
julien94270 test

julien94270

Posted
  • Author
Posted

Thanks a lot to AncientWarrior and Jonathan !! It works and you were right !
(and sorry for my english... I am french :-) )

One more question about the scroll :
When the scroll is done, can I as well add in my ScrollTo function an "onComplete" event to animate a new tween  ? 

For exemple, after the scroll, I want to add a purple square, and animate it ... What is the best way ??

Is it to have my purple square in a DIV at the begining, make it invisible with (visibility: hidden), and make it visible somewhere
in my new onComplete function with (visibility:visible) ?

Thank !!!

Link to comment
Share on other sites
  • Solution
Diaco test

Diaco

Posted
  • Solution
Posted

hi julien94270  :)

 

yep , you can , but I recommend you that to use Timeline for your tween sequence instead of tweens with onComplete functions in this case ; you ill have same result , your code is more clear and have the benefits of Timelines .

 

same result with Timeline :

See the Pen zqKdj by anon (@anon) on CodePen

 

and for your purple function you can choose one of these :

 

set without tween :

TweenLite.set(purple, {visibility:"visible"}) 

2 way to tween :

TweenLite.to(purple, 2, { autoAlpha:1});

TweenLite.fromTo(purple, 2, { opacity:0},{ opacity:1, visibility:"visible"});
  • 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
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...