Jarring scroll-fix: cleanup on scroll and expand

This commit is contained in:
Klaas van Schelven
2023-11-17 19:10:48 +01:00
parent ab72931bf0
commit 30f3ff9f31

View File

@@ -9,10 +9,17 @@ function distanceToWindowBottom() {
}
onscroll = (event) => {
console.log(distanceToWindowBottom());
setBodyMinHeight();
};
// This is the important part!
function setBodyMinHeight() {
let bodyHeightPreCollapse = document.body.offsetHeight;
let body = document.querySelector("body");
// console.log("was actually", bodyHeightPreCollapse, "minimally", body.style.minHeight);
body.style.minHeight = (bodyHeightPreCollapse - distanceToWindowBottom()) + "px";
// console.log("is now actually", document.body.offsetHeight, "minimally", body.style.minHeight);
}
function collapseSection(element) {
if (element.getAttribute("data-collapsed") === "true") {
return;
@@ -20,14 +27,8 @@ function collapseSection(element) {
// get the height of the element's inner content, regardless of its actual size
var sectionHeight = element.scrollHeight;
let bodyHeightPreCollapse = document.body.offsetHeight;
console.log("?", sectionHeight, distanceToWindowBottom());
if (sectionHeight > distanceToWindowBottom()) {
let body = document.querySelector("body");
console.log((bodyHeightPreCollapse - distanceToWindowBottom()) + "px");
body.style.minHeight = (bodyHeightPreCollapse - distanceToWindowBottom()) + "px";
}
setBodyMinHeight();
element.classList.remove("xl:flex"); // this appears to be necessary, not sure why
@@ -58,6 +59,8 @@ function expandSection(element) {
return;
}
setBodyMinHeight();
element.classList.add("xl:flex"); // add back
// get the height of the element's inner content, regardless of its actual size