colgora/Mangarr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(reader): corriger le scroll vers le haut bloqué en mode infini

Browse Source 
Les IntersectionObserver utilisaient root: null (viewport) au lieu du
conteneur de scroll réel (.infinite-reader). Le rootMargin de 1000px
était donc calculé par rapport au viewport, causant un montage/démontage
des pages à des moments imprécis et des sauts de layout lors du scroll
vers le haut.

Supprime également scroll-behavior: smooth sur le conteneur, qui entrait
en conflit avec le scroll anchoring du navigateur lors des corrections de
position, donnant l'impression que le scroll redescendait tout seul.
This commit is contained in:
ext.jeremy.guillot@maxicoffee.domains
2026-03-26 16:11:19 +01:00
parent c2b55e9018
commit 45f7e88024
1 changed files with 2 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
assets/vue/app/domain/reader/presentation/components/InfiniteReader.vue
View File

@@ -109,7 +109,7 @@ import ReaderPage from './ReaderPage.vue';
visibilityObserver.value?.disconnect(); visibilityObserver.value?.disconnect();
observer.value = new IntersectionObserver(observeIntersection, { observer.value = new IntersectionObserver(observeIntersection, {
root: null, root: containerRef.value,
threshold: 0.5 threshold: 0.5
}); });
@@ -124,7 +124,7 @@ import ReaderPage from './ReaderPage.vue';
} }
}); });
}, },
{ root: null, rootMargin: '1000px 0px', threshold: 0 } { root: containerRef.value, rootMargin: '1000px 0px', threshold: 0 }
); );
nextTick(() => { nextTick(() => {
@@ -328,7 +328,6 @@ import ReaderPage from './ReaderPage.vue';
@apply flex-1 flex flex-col items-center overflow-y-auto relative min-h-0; @apply flex-1 flex flex-col items-center overflow-y-auto relative min-h-0;
/* Réduction du padding sur mobile */ /* Réduction du padding sur mobile */
@apply py-2 sm:py-8; @apply py-2 sm:py-8;
scroll-behavior: smooth;
} }
.page-wrapper { .page-wrapper {