Jump to content
Search Community

Tom_S

Members
  • Posts

    4
  • Joined

  • Last visited

Tom_S's Achievements

  1. Hey, I'm having an issue where I'm using onWheel for a custom slider I'm building but when the mouse is on the slider it prevents scrolling of the body. I'm happy to use vanilla event listeners but I was wanting to use Observer as I already use it for drag. Is there a fix for this? Thanks
  2. Hi Rodrigo, I'm still having this issue, I decided to not implement scroll trigger on an internal page, but in this case it is really detrimental to project. I've done a screen recording which seems to give some understanding of what is going off here; https://www.loom.com/share/6ccf5d1d978241a68b30dabc48fde49d It seems like SvelteKit does the following; 1. Appends the new page under the current page. 2. Moves the scroll position to the top of the screen. 3. Hides the current page. This means `onMount` is calculating the scroll positions right at the bottom. I'm unsure whether this is a bug with SvelteKit as I've only recently come across this issue. But I think that is what is happening here. EDIT FIX: If you are using Svelte Transition at any point, use `|local` so `use:transition|local` without `local` it will try and animate between pages.
  3. Hi @Rodrigo, I am cleaning up, return { destroy: () => { gsapContext.revert(); } }; This part of the code reverts the context on destroy. Thanks, Tom
  4. Hello, I'm having an issue with SvelteKit and ScrollTrigger. On the second route it's not correctly calculating where the stop and start needs to be, on top of that if I navigate from the homepage but don't active the scrollbar the ScrollTrigger doesn't work at all. https://www.loom.com/share/11ef7e8080ec4c439d7dee48d32ce6e8 In this instance I'm using `use:` import { gsap } from 'gsap'; import { ScrollTrigger } from 'gsap/dist/ScrollTrigger'; export function fadeUp(node: HTMLElement) { gsap.registerPlugin(ScrollTrigger); const gsapContext = gsap.context(() => { gsap.fromTo( node, { y: 50, autoAlpha: 0 }, { y: 0, autoAlpha: 1, scrollTrigger: { trigger: node, start: 'top bottom', end: 'top 70%', scrub: true } } ); }); return { destroy: () => { gsapContext.revert(); } }; } I've tried doing `ScrollTrigger.refresh()` when the page is mounted using `onMount()` but that doesn't fix it either. I'm really confused what is happening here. Has anyone else come across this before?
×
×
  • Create New...