FrEZ

I see that you have managed to achieve it. Is it possible for me to get the old and new code to see what you have changed to make it work, as just switching wheelspeed didn't do it for me, as I am not using a separate scrolltrigger to enable Observer. Cheers!

I saw that you can check Observer.isTouched, don't know if that's the most efficient way, but if it is, can I get an example of it in use?

As you can see, when you scroll down with mouse, it works perfectly, but on touch you have to touch the opposite direction. Any idea how to make it when on mobile, or on touch to switch onUp and onDown?

A Pen by George (codepen.io) The animations aren't the most precise, but the idea is that on codepen everything works fine. On my project it doesn't where it's all the same, except, as I said, I have multiple ScrollTrigger.observe and Observers. Could that be the issue? Didn't find a reason why it doesn't work but when I use ScrollTrigger.create it works.

Could I get an actually working prototype of a scrolltrigger in action, so that I can test if it's from my animation? Though I don't get the error in the codepen, the aniamtion as a whole doesn't function. My scroller isn't the body, it's a custom element

A Pen by George (codepen.io) The animations aren't the most precise, but the idea is that on codepen everything works fine. On my project it doesn't where it's all the same, except, as I said, I have multiple ScrollTrigger.observe and Observers. Could that be the issue?

gsap.registerPlugin(Observer, ScrollTrigger, ScrollToPlugin); I do register the plugin, just forgot to include it in the code

I do register the plugin, just forgot to include it in the code

gsap-core.js:89 Invalid property scrollTrigger set to {trigger: div.fifth-wrap, start: 'top center', end: '+=400', scrub: true, markers: true}end: "+=400"markers: truescrub: truestart: "top center"trigger: div.fifth-wrap[[Prototype]]: Object Missing plugin? gsap.registerPlugin() When I console.log ScrollTrigger I get this ScrollTrigger2(vars, animation) { _coreInitted || ScrollTrigger2.register(gsap) || console.warn("Please gsap.registerPlugin(ScrollTrigger)"); this.init(vars, animation); Could the problem come from the fact I am using multiple scrolltriggers? let fifthWrapText = gsap.utils.toArray('.fifth-wrap') fifthWrapText.forEach((section) => { let title = section.querySelector(".business-title"); let text = section.querySelector(".business-general"); gsap .timeline({ scrollTrigger: { trigger: section, start: "top center", end: "+=400", scrub: true, markers: true } }) .from(title, { opacity: 0, x: 500 }) .from(text, { xPercent: -120 }); });

I want touch and scroll to not function when they are on a certain element. I tried using ignore and it worked for a div that covers the whole page, but not for the one I am using which covers half of it. Any idea how I can fix it? ScrollTrigger.observe({ target: window, ignore: startScreen || carousel, type: "wheel, touch", onUp: () =>mainFunc(index- 1), onDown: () =>mainFunc(index+ 1), });

https://codepen.io/NikiKarai/pen/GRBGXeO?editors=1111 Need help with snapping to correct values at onStop, spinning correctly, as right now it spins out of control

Any idea how to fix the navigation, as right now it spins to the correct value, but at the end changes to the last.

Well, I managed to fix the snapping to go to correct values, but it still spins incorrectly.https://codepen.io/NikiKarai/pen/GRBGXeO

Who can I contact that I can pay to finish this job for me? I am unable to do it myself.

Do you think wrapping updating the snap to 1/images.length*2 and the wrap to -1 to 1 will do the desired job for the logic?

I would greatly appreciate it if you could help me fix the issues behind the inconsistencies in my logic as I am truly stuck here.

I don't understand what's making my progressX.value negative. I see that it's because of p, and so I wrap the progressX.value within 0-1. Why does it still come out negative?

Anyone got any idea why my snapping values are getting mixed up? Also any idea how to add an animating variable that sets to true once my gsap.to progressX value is finished, so then the onStop gets the progress value and I don't have to use onStopDelay that is inconsistent? Thanks in advance!

This is exactly what I am looking for, thanks! Just one thing. By using gsap.set we kill the whole animation of the spin. Any idea how to preserve that? It creates bugs for scrolling as well. Also you should add progress = snap(spin.progress()) at the end of onStop to remove that flicker when spinning again.

I figured out the navigation, but don't know how to properly write the snapping.

Any idea how to do the navigation or snapping to closest image?

Well, for some reason I understood it better from this person and managed to do it

I'll be using an observer

Thanks for the reply! Wrapping fixes most of it! My current issue is calling the timeline a second time. For example, when I call onDown, it does the animation, but when I call it again, it doesn't. I believe that that's an issue from calling a timeline twice? Could possibly be having issue with the reverse method. Any idea on how to fix it? Thanks! Please make sure to check out the updated codepen A Pen by George (codepen.io)

I opened a new topic because I explained the problem more in detail there. Also I didn't get an answer here. I will ask once again, can you please not close my topic? It's not a duplicate as it is a different codepen with a similar issue, but not quite the same as it goes into more detail. Take care!