Svelte: ScrollTrigger and from()

[joshuua]

Hi there,

 

I'm using Svelte (SvelteKit specifically) and am running into an issue when using scrollTrigger with .from().

 

Seems like it's something to do with gsap not being able to detect what the destination values should be for the animations, to() works fine.

That said, Without scrollTrigger applied, the animation works ok.

 

The element just stays stuck at the values provided and doesn't animate. I have verified the trigger with `onEnter: () => console.log('check')`

 

Basic example:

<script>
	import gsap from 'gsap/dist/gsap.js';
	import { ScrollTrigger } from 'gsap/dist/ScrollTrigger.js';
	import { onMount } from 'svelte';
	gsap.registerPlugin(ScrollTrigger);

	onMount(() => {
		gsap.from('#my-elem', {
          	scrollTrigger: '#my-elem'
			x: 100
		});
	});
</script>

 

[OSUblake]

Welcome to the forums @joshuua

 

It sounds like you may have stumbled upon a known regression in 3.9.1. It's fixed in next release, but for now try setting lazy: false on the tween.

[joshuua]

46 minutes ago, OSUblake said:

Welcome to the forums @joshuua

 

It sounds like you may have stumbled upon a known regression in 3.9.1. It's fixed in next release, but for now try setting lazy: false on the tween.

Oh my.. Thanks for that @OSUblake, thought I was going crazy! lazy: false has indeed solved it for now.