[Reduce speed of NormalizeScroll in Mobile]

Hello @Rodrigoyes I will try to do it I just have to take the time given the work I have at the moment thank you

[Reduce speed of NormalizeScroll in Mobile]

On 3/25/2024 at 3:14 PM, Brandemic said:

I use scrolltrigger and observer for an animation in my website, for mobile it created a problem of not pinning accurately so I used normalizescroll. It does work great but, when I scroll, it scrolls really fast. is there any solution for it?

I confirm this :
I'm trying to use this feature and on IOS I have the impression that scrolling is faster

[Pin section flickering with Scrolltrigger and smooth-scrollbar]

Hello @Shaun Gorneau and all,

 

I found my problem So here is what I did :

 

ScrollTrigger.create({
            trigger: this.$target,
            //refreshPriority: 0,
            invalidateOnRefresh: true,
            pin: this.$wrapper,
            //pinType: typeof window.SB !== 'undefined' ? 'transform' : 'fixed',
            //pinType: document.querySelector(".scroll-content").style.transform ? "transform" : "fixed",
            pinType: "transform",
            //pinSpacing: 'padding',
            preventOverlaps: true,
            anticipatePin: 1,
            scrub: 0.5,
            start: "bottom bottom",
            end: '+=2700',
            //end: () => "+=" + innerHeight,
            markers: true,
            onEnter: function () {
                window.SB.setMomentum(0, 0);
                window.SB.options.damping = 10;
            },
            onEnterBack: function () {
                window.SB.setMomentum(0, 0);
                window.SB.options.damping = 10;
            },
            onLeave: function () {
                window.SB.options.damping = 0.12;
            },
        });

I realized that with the value at 10 in damping my problem disappeared.

 

So i paused smoothscrollbar by re-entering the section once scrolltrigger throws the pin.

 

And the same when you get back into the section

 

Thank you

[Pin section flickering with Scrolltrigger and smooth-scrollbar]

Hello @Shaun Gorneau and thank you for your response.

 

So yes I'm on macOS. I develop on firefox dev, I have the problem on this browser but also on chrome and safari.

 

Yes I can give you a private URL if you wish !

 

thanks again for your help

[Pin section flickering with Scrolltrigger and smooth-scrollbar]

Hello all ,

 

I'm on a new version of our site for the agency.

 

We currently have this library in addition to GSAP, scrolltrigger etc: https://github.com/idiotWu/smooth-scrollbar

 

I have a section on home where I pin using Scrolltrigger, except I get flickering when I scroll and I can't fix it.

 

I read all the topics that were related to this problem (https://greensock.com/forums/topic/26008-scrolltrigger-flickering-when-pinned/)

 

I can not understand where the problem comes from because I put the right thing.

 

I made a video for you to see because the site is local : https://e-kosmo.com/problem-pin.mp4

 

pinType > fixed doesnt work

pinType > 'transform' work with flickering

 

ScrollTrigger.create({
            trigger: this.$target,
            refreshPriority: 0,
            invalidateOnRefresh: true,
            pin: this.$wrapper,
            pinType: typeof window.SB !== 'undefined' ? 'transform' : 'fixed',
            //pinType: document.querySelector(".scroll-content").style.transform ? "transform" : "fixed",
            //pinType: 'fixed',
            pinSpacing: 'margin',
            anticipatePin: 1,
            scrub: 0.5,
            start: "bottom bottom",
            end: '+=2700',
        });

 

 

Thank you in advance for your help and feedback

 

Nickolas

[Problem with killing and reinitialising ScrollTrigger after Single Page App page transition]

On 6/8/2021 at 12:32 AM, jltech said:

Something that helped me in Reactjs was to kill all the ScrollTriggers on a page when it dismounts.

 

In the useEffect I have to create the ScrollTriggers I am doing this:

 

useEffect(() => {
  ...
  ...
  return () => {
    // We kill all scroll triggers so the next pages can recreate them.
    const triggers = ScrollTrigger.getAll();
    if (triggers) {
      triggers.forEach((trigger) => {
        trigger.kill();
      })
    }
  };
}, []);

 

Hope this helps someone.

Thanks for your help I was trying to destroy my animations after loading barbaJS

[Help to pathDataToBezier]

20 minutes ago, mikel said:

Hi @kosmo,

Welcome to the GreenSock Forum.

 

I'm not sure if I understood you correctly.

 

So my interpretation. You need an open path, an open circle.
The endpoints can be on top of each other.

Here is the dry version without scroll action:

 

See the Pen jXoQvp by mikeK (@mikeK) on CodePen

 

For all friendship: Your code looks a little bit weird.
Study the docs and build up piece by piece.

 

Good luck and happy tweening ...

Mikel

 

 

Hi @Mikel,

actually I learn at the same time that I code, there are things that I still miss in the construction with timelinemax.

Thank you for your help and your speed, I will look at this.

[Help to pathDataToBezier]

Hi GSAP community!

A huge thank you because thanks to you we can do something beautiful!
For the needs of my future company that I am develloper I need to do a scroll action like this example> https://codepen.io/GreenSock/pen/GopRwQ

I get there very well except that I wish

1. Have my line continue in draw svg until the end (scene with scrollmagic)
2. Stop the blue circle at a certain position while element 1 continues to end. (scene with scrollmagic too)

I can not stop my tween blue...

Can you help me ?

thank you in advance

See the Pen EGzRZo by dngraphisme (@dngraphisme) on CodePen