Spaces:
Running
Running
File size: 943 Bytes
dd8990d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
<script lang="ts">
import { createEventDispatcher, onDestroy, onMount } from 'svelte';
const dispatch = createEventDispatcher();
let loaderElement: HTMLElement;
let observer;
let intervalId;
onMount(() => {
observer = new IntersectionObserver(
(entries, observer) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
intervalId = setInterval(() => {
dispatch('visible');
}, 100);
// dispatch('visible');
// observer.unobserve(loaderElement); // Stop observing until content is loaded
} else {
clearInterval(intervalId);
}
});
},
{
root: null, // viewport
rootMargin: '0px',
threshold: 0.1 // When 10% of the loader is visible
}
);
observer.observe(loaderElement);
});
onDestroy(() => {
observer.disconnect();
if (intervalId) {
clearInterval(intervalId);
}
});
</script>
<div bind:this={loaderElement}>
<slot />
</div>
|