Stop tab switches jumping the page to the top

Switching tabs scrolled back to the top, on the theory that arriving halfway
down a different tab is disorienting. In practice it is the wrong way round:
the tab row is sticky, so you switch tabs *from* wherever you have scrolled to,
and being thrown back past the log buttons you had deliberately scrolled off is
more disruptive than landing part-way down the new tab.

So it simply does not scroll now. If the new tab is shorter than the old scroll
position the browser clamps on its own and needs no help.

The `scroll` option goes with it rather than being defaulted off — nothing
passes it any more, and a parameter no caller uses is a worse thing to leave
behind than the behaviour it guarded.
This commit is contained in:
Alexander Heldt
2026-09-07 20:13:55 +00:00
parent e7b54b82fd
commit de1e18e394
2 changed files with 10 additions and 5 deletions
+9 -5
View File
@@ -4734,7 +4734,7 @@
showTab(DEFAULT_TAB, { manageBack: false });
});
function showTab(id, { scroll = true, manageBack = true } = {}) {
function showTab(id, { manageBack = true } = {}) {
if (!tabButtons.some(b => b.dataset.tab === id)) id = DEFAULT_TAB;
activeTab = id;
for (const b of tabButtons) {
@@ -4746,8 +4746,12 @@
}
for (const p of tabPanels) p.hidden = p.dataset.tab !== id;
document.querySelector(".chart-window").hidden = TABS_WITHOUT_CHARTS.has(id);
// Arriving halfway down a different tab is disorienting.
if (scroll) window.scrollTo({ top: 0 });
// Deliberately no scrolling. Switching used to jump to the top, on the
// theory that arriving halfway down a tab is disorienting — but the tab bar
// is sticky, so you switch tabs *from* wherever you have scrolled to, and
// being thrown back past the log buttons you had just scrolled off is worse.
// If the new tab is shorter than the old scroll position the browser clamps
// on its own, which needs no help from us.
try { localStorage.setItem(TAB_KEY, id); } catch { /* ignore */ }
if (manageBack) {
if (id !== DEFAULT_TAB) {
@@ -4773,7 +4777,7 @@
if (!step) return;
e.preventDefault();
const next = tabButtons[(i + step + tabButtons.length) % tabButtons.length];
showTab(next.dataset.tab, { scroll: false });
showTab(next.dataset.tab);
next.focus();
});
}
@@ -4797,7 +4801,7 @@
}
measureDayBar();
showTab(loadTab(), { scroll: false });
showTab(loadTab());
// ---------- wiring ----------
document.querySelectorAll("button.action").forEach(btn => {