scroll buffer in room_scroll.html aperture fine-tuned so that 'What happens next…?' can always be reached by scrolling on a fresh page reload, even if the user was at the very end of the scroll
Some checks failed
ci/woodpecker/push/woodpecker Pipeline failed
Some checks failed
ci/woodpecker/push/woodpecker Pipeline failed
This commit is contained in:
@@ -11,22 +11,21 @@
|
||||
// Inline scripts can run before nested flex heights are computed, producing
|
||||
// wrong scrollHeight/clientHeight values (symptom: incorrect marginTop on mobile).
|
||||
requestAnimationFrame(function() {
|
||||
// Push buffer so its top aligns with the bottom of the aperture when all
|
||||
// events fit within the viewport (no natural scrolling).
|
||||
var buffer = scroll.querySelector('.scroll-buffer');
|
||||
if (buffer) {
|
||||
// Push buffer so its top aligns with the bottom of the aperture when all
|
||||
// events fit within the viewport (no natural scrolling needed).
|
||||
var eventsHeight = scroll.scrollHeight - buffer.offsetHeight;
|
||||
var gap = scroll.clientHeight - eventsHeight;
|
||||
if (gap > 0) {
|
||||
buffer.style.marginTop = gap + 'px';
|
||||
}
|
||||
}
|
||||
|
||||
// Only restore if there's a meaningful saved position — avoids a
|
||||
// no-op scrollTop assignment (0→0) that can fire a spurious scroll
|
||||
// event and reset the debounce timer in tests / headless browsers.
|
||||
if ({{ scroll_position }} > 0) {
|
||||
scroll.scrollTop = Math.max(0, {{ scroll_position }} - scroll.clientHeight);
|
||||
// Always land with the buffer's top flush against the bottom edge —
|
||||
// the user must scroll down to reveal "What happens next…?"
|
||||
// Reading offsetTop here forces a synchronous reflow so the margin
|
||||
// set above is already reflected in the value.
|
||||
scroll.scrollTop = Math.max(0, buffer.offsetTop - scroll.clientHeight);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user