Tagliavia

I have added my npmrc file with my token but whenever I try to run: npm install gsap@npm:@gsap/shockingly It gets stuck displaying this: (⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂) ⠏ idealTree:landing: sill idealTree buildDeps Any help greatly appreciated

Sorry for the late response Jack been a very busy week. Your timing is perfect and I will be able to use smoothscroller for my product. Thank you all for the amazing support and follow up!.

Thanks Jack I can confirm it is working on IOS, tested android in browser stack Select is getting focus but drop down is not opening inputs behave as expected.

My bad Jack I did use the beta of scroll smoother but didn't use the beta of scroll trigger. Will try immediately. Question will I be able to download these beta for use on my current project?.

Ok after testing the script issue remains, inputs and select are unable to gain focus on mobile devices. Labels do work transferring focus to the associated input, but do not trigger the open action for the drop down. Tested by downloading the minified file of the beta and importing it at the top of JS file instead of using the node_modules import.

Thanks Jack will do and give you feedback!. I appreciate all your help.

Thank you guys for the support, if you find any work around please let me now... I can turn off the scroll smoother on phones but personally love what you did to normalize the screen size.

Sorry for the late reply, got complicated with some health issues. I stand corrected regarding scrolltrigger.refresh() adjusting height of smoothscroller content. However it didn't get triggered after creating the scroll trigger instances for the media query. After triggering it directly it fixed the issue. However I have another issue, the touch event on the scroll smoother wrapper on mobile devices, prevents the events to reach the inputs and selects on the form, at the moment I have no way of opening the drop down menu. Any help is appreciated https://codepen.io/riccardodev/pen/YzYYYQB

Sure thing, will try to replicate the issue tonight. Also noticed an issue with the touch event on the wrapper affecting inputs to gain focus on touch. Hope to have them both by tomorrow

Hi folks and thanks for the awesome help here as always!. Turns out I initialized SmoothScroller too soon, scroll trigger refresh didn't resolve the issue about the size of content element of smoothScroller. Moved smoothScroller initialization to window.load event and issue got fixed.

Hi I have an scroll trigger pinned that im creating after the SmoothScroller For some reason it isn't updating the content height after the pin spacer is added to the DOM. Any way to trigger it?

Thanks lets see if we can get more info about it.

Thanks for the reply sir, yes in fact that what i find odd the whitespace pre-line is present

Hi everyone I have some text that comes from i18n and has \n to break the text in different lines. When using split text it is all appearing in a single line. Any work around would be kindly appreciated

Thank you sir!!

Hi folks I have a box that i want the user to drag and go back to start position on release, something like if attached by a rubber. How can i get around it with draggable?

Awesome

Just to let you guys know I'm getting this when trying to load Greensock website on Safari, after Big Sur / Safari update on 09/21/21.

Thanks Jack thats good to know

I had a similar issue on iOS, tried the 100vh height solution but it made no difference, in fact it actually affected the design since on scroll down you will see an empty space where the safari app bar pops up. However as weird as it sounds having absolutely placed items displaced with yPercent or y below the confines of the pinned element caused the problems with "labels" and "directionalLabels" snapping. After changing the elements height to keep them in the bounds of the pinned element snapping worked perfectly. Also had some very jumpy pinning of the container which was caused by an image that modified the height of the dom on render, so I would recommend to have a placeholder for the images just in case.

Thank you very much Jack, that cleared a lot of things. I want the animation to restart but i guess i can seek(0) when calling pause(). Have one more question thought... Can we use ScrollTrigger matchmedia with and animation declared this way?, in the docs it always pull an ScrollTrigger instance instead of a Timeline.

Hi everyone. I have a ScrollTrigger scrub animation of sections, each section have loop animations inside. I would like to know what would be the best way to play the loop only on a range of the ScrollTrigger. In the codeine basically I want the rotating text to play from the beginning once the section-2 begins to appear and stop it when the section 3 covers it. Animation should be restarted on enter back of the same range. Thanks in advance

I know i should provide a codepen but is a complex animation. On Iphone when swiping to scroll, the animation keeps stuttering back and forth instead of going to next label or previous label. Any insight into the how to debug or examine the issue would be greatly appreciated. Just signed for Greensock club so probably good time to try the GSDevTools, regarding the dev tools would love to know if there is any guide about how to use it with react. Additional info that might be pertinent: The section where all the timeline animations gets executed is pinned, height is 100vh, not sure if it might be related to the bottom toolbar that safari displays on scroll.

OK solved it with https://greensock.com/docs/v3/Plugins/ScrollToPlugin However any way to skip a scrolltrigger animation in between the origin position and the target element?

My experience so far, make use of the useSelector Hook as much as possible. One ScrollTrigger per item to be animated or timeline. (best way to avoid glitches or bugs) If using i18next preload all of your Namespaced translation files or you might suffer very bad glitches during the loading of translations outside of suspense. Have a good one.