search

beyonk-group / svelte-carousel

A super lightweight, super simple Carousel for Svelte 3
MIT License
213 stars 38 forks source link

Add on:ready event or similar? #53

Open cliveportman opened 3 years ago

cliveportman commented 3 years ago

I'm using the AOS library here: http://michalsnik.github.io/aos/ It's great and generally works well with Svelte. But mixing it with a carousel is giving me some issues, such as AOS's offset calculations being out. What I'd like to do is only initialise AOS when the carousel has built. I'm trying: $: if (carousel) AOS.init() But that doesn't help. Could we have an on:ready event or something like that that I can listen for before initialising AOS? I'm sure it would help others.

antony commented 3 years ago

@cliveportman happy for this to be the case if you can provide a PR :)

kiuKisas commented 3 years ago

To emulate this, I bind my carousel to a variable and wait for it to not be undefined anymore.

<script>
  import Carousel from '@beyonk/svelte-carousel';
let carousel = undefined;
</script>

<div class={carousel === undefined ? 'loading' : 'ready'}></div>
<Carousel bind:this={carousel}>
...
</Carousel>