Search the Community
Showing results for tags 'observer'.
Found 32 results
-
Hey guys, sorry for no codepen this time...I wanted to check if it's possible first and ask if you know any demos that try this approach. I was trying to find any examples but from what I see no one tried to do it yet. While I wait for the answer I am working on a demo. I have a lottie animation - it's a 3d model being rotated 360 degrees. I want to be able to drag on x axis to "rotate" that 3d model, without using any UI element - just simple drag anywhere on the area to start rotating. So first of all, is it even possible to use draggable this way? Maybe there are some demos that show control of lottie with drag on mouse x? All codepens I saw were using scrolltrigger to control the animation, but I can't do that. Maybe observer is also an option?
-
Gsap observer and and scroll tirgger expert required urgent $100/hr
adil17 posted a topic in Jobs & Freelance
If you are an expert, hit me a message right now, please contact me right now I have a few hours of work today, it's urgent. If you have experience in the observer, that would be great otherwise, the scroll trigger will work, but I need premium quality of smoothness and finish in animation. Html is already ready you only have to apply the gsap code for animation. I need an expert who can apply the animation right away, not a beginner who needs days to create animations. -
Hi guys, I have set up horizontal scrolling page using scrollTrigger and that works just fine (Lenis smooth scroll is present if that in any case impacts the following issue at all). Horizontal scroll: let scrollTween = gsap.to(this.scroll, { xPercent: -100, x: () => "100vw", ease: "none", scrollTrigger: { pin: this.wrapper, trigger: this.wrapper, start: "left left", end: () => `+=${this.scroll.offsetWidth} bottom`, scrub: true, }, }); What I need to accomplish is if users on trackpads (macbook) scroll horizontally (swipe with two fingers in the horizontal direction on trackpad) scrollTrigger updates and everything works as a "normal" scroll. overscroll-behavior-x: none; is also added to body to prevent default gestures on trackpad — browser history back/forward. Is there a way Observer can come in to handle this and update scrollTween somehow? Thanks...
-
hi @PointC @GSAP Helper I hope that you are doing great. I'm super new to Gsap Forum. I was wondering if its possible to use Observer with ScrollTrigger container animation? I'm trying to create a website with multiple horizontal sections. My main problem now is the animations on each section and I'm unable to trigger it properly. I know if I was using container-animation then it would be easy but with Observer how can I trigger different animations on different sections? Hopefully my question is clear. Thanks, Kamran
-
Hey, pls help me in a scenario like if I scroll fast then I miss the text and it jumps to the next section. It should always show the text and image swapping section should be in view when user scrolls again. I am sharing a demo here.
-
hello everyone, thanks for reading. i want to navigate to section by clicking dot Indicator. i have tried to change the Observer code but couldn't Understand the Logic to Sync Both. please Give Me your guidance. thank you very much.
-
Address Bar on mobile messes up the positioning of an element after animation
Riccardo1091 posted a topic in GSAP
Hi, it's me again, I've achieved what I wanted both on desktop and mobile but on the latter I have this new problem of the addresbar messing things up. Let me explain, on mobile I have positioned this "isthmo" logo right above the bottom of the page, if I swipe up it goes on top, if I swipe down it goes back to the starting point. The address bar keeps getting in the way, I don't think u can see the problem on the codepen due to its structure so I'll attach some screenshots from the real website. I tried: ScrollTrigger.normalizeScroll(true); but it wasn't working well, plus disabled the page refreshing swiping down Should I try: ScrollTrigger.config({ ignoreMobileResize: true}) Thanks for your patience
