Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Ctrl+Shift+f5

Great change but workload increased

Recommended Posts

Hi, 

I've been using GSAP 2 for around 2 months for now. 
By using the knowledge I have I've created some basic animations using it.

Now that the GSAP3 has arrived every thing looks a tini-tiny bit difficult.(but can be achieved)

I know its new and i also know this is the only place i can get support.

 

My problem is as follows,

I have used Tweenmax and scroll magic to create a basic effect. 
Now that Tweenmax has been merged in GSAP core I cannot use the `.setTween(t1)`.
As we have to Specify the animation at first in the Tweenmax and call them later using setTween.

How can I achieve it in GSAP3

 

One more important thing as you can see the page scroll is smooth on the page.
A friend of mine has given me the script to implement in the page that will make the page scroll smooth.

Now i have lost contact with him. I wonder If someone could re code the script for me. I would be more than thankful

Here is the codepen link for my example: 

 

Thanks in advance

See the Pen MWWBmWa by Wahed98666 (@Wahed98666) on CodePen

Link to post
Share on other sites
3 minutes ago, Ctrl+Shift+f5 said:

Now that Tweenmax has been merged in GSAP core I cannot use the `.setTween(t1)`.

 

Why not? ScrollMagic doesn't know the difference.

  • Like 1
Link to post
Share on other sites

And I wrote that SmoothScroll page script, but it is not designed to work with ScrollMagic, and I don't have the time to troubleshoot smooth scrolling issues anymore.

Link to post
Share on other sites
37 minutes ago, OSUblake said:

 

Why not? ScrollMagic doesn't know the difference.

Have you gone through my code pen. Why is it not working there?

 

Link to post
Share on other sites

Isn't it working in the demo I posted? That's using v3.

Link to post
Share on other sites

It says scroll magic is not defined

`jquery.min.js:2 Uncaught ReferenceError: ScrollMagic is not defined`

 

Ive linked the js files as follows

 

    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/gsap@3.0.1/dist/gsap.min.js"></script>
    <script scr="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.5/ScrollMagic.min.js"></script>
    <script scr="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.5/plugins/animation.gsap.js"></script>
    <script scr="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.5/plugins/debug.addIndicators.min.js"></script>
Link to post
Share on other sites
45 minutes ago, OSUblake said:

And I wrote that SmoothScroll page script, but it is not designed to work with ScrollMagic, and I don't have the time to troubleshoot smooth scrolling issues anymore.

Can you suggest me what should I do for the smooth scrolling of the page. Do i need to recode everything now  :_{

Link to post
Share on other sites
1 hour ago, OSUblake said:

Isn't it working in the demo I posted? That's using v3.

 

Maybe not. ScrollMagic needs to change the onOverwrite property.

 

image.thumb.png.ebf8d5154366140b5ee9feadaa118e82.png

 

Open an issue with them. ScrollMagic isn't a gsap product.

https://github.com/janpaepke/ScrollMagic

 

  • Like 2
  • Thanks 1
Link to post
Share on other sites

It worked after I replaced the code from your pen. I don't know what the issue was. But its resolved right now.

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

×