Compare commits
No commits in common. "01adf70585ba9d9967b2d5bd2f7198dfa4de358f" and "09d05f53da24117971d5e2da305a0ee20ed874b6" have entirely different histories.
01adf70585
...
09d05f53da
1 changed files with 1 additions and 28 deletions
|
|
@ -33,26 +33,7 @@
|
|||
const wrapperWidth = $derived(`${slides.all.length * 100}vw`)
|
||||
const wrapperTransform = $derived(`translateX(-${slides.activeIndex * 100}vw)`)
|
||||
|
||||
let isReady = $state(false)
|
||||
let isResizing = $state(false)
|
||||
let resizeTimer = null
|
||||
|
||||
// Active la transition seulement après le premier paint à la bonne position.
|
||||
// Sans ça, un chargement sur /expertise slide depuis l'accueil.
|
||||
$effect(() => {
|
||||
if (slides.all.length > 0 && !isReady) {
|
||||
requestAnimationFrame(() => { isReady = true })
|
||||
}
|
||||
})
|
||||
|
||||
onMount(() => {
|
||||
const handleResize = () => {
|
||||
isResizing = true
|
||||
clearTimeout(resizeTimer)
|
||||
resizeTimer = setTimeout(() => { isResizing = false }, 150)
|
||||
}
|
||||
window.addEventListener('resize', handleResize)
|
||||
|
||||
const handleKeydown = (e) => {
|
||||
if (e.key === 'ArrowRight') {
|
||||
const next = slides.all[slides.activeIndex + 1]
|
||||
|
|
@ -63,11 +44,7 @@
|
|||
}
|
||||
}
|
||||
window.addEventListener('keydown', handleKeydown)
|
||||
return () => {
|
||||
window.removeEventListener('resize', handleResize)
|
||||
window.removeEventListener('keydown', handleKeydown)
|
||||
clearTimeout(resizeTimer)
|
||||
}
|
||||
return () => window.removeEventListener('keydown', handleKeydown)
|
||||
})
|
||||
</script>
|
||||
|
||||
|
|
@ -77,7 +54,6 @@
|
|||
<main class="main">
|
||||
<div
|
||||
class="slides-wrapper"
|
||||
class:is-animated={isReady && !isResizing}
|
||||
style="width: {wrapperWidth}; transform: {wrapperTransform}"
|
||||
>
|
||||
{#each slides.all as slide}
|
||||
|
|
@ -130,9 +106,6 @@
|
|||
.slides-wrapper {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.slides-wrapper.is-animated {
|
||||
transition: transform 1000ms cubic-bezier(0.77, 0, 0.175, 1);
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue