sa6anw
/
sl6cv
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

bilden
continuous-integration/drone/push Build is passing Details

This commit is contained in:
Joakim Svensson 2025-05-09 14:47:40 +00:00
parent 8277de849c
commit bd1fb6c500
1 changed files with 26 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
docs/index.md
View File

@ -21,27 +21,40 @@ title: Start
</script> </script>
<script> <script>
function toggleMenuVisibility() { window.addEventListener("scroll", () => {
const content = document.getElementById("main-content"); const content = document.getElementById("main-content");
const header = document.querySelector(".md-header"); const header = document.querySelector(".md-header");
const sidebar = document.querySelector(".md-sidebar"); const sidebar = document.querySelector(".md-sidebar");
const contentTop = content.getBoundingClientRect().top;
if (contentTop <= 0) { const contentY = content.getBoundingClientRect().top;
header.style.opacity = "1"; const windowHeight = window.innerHeight;
sidebar.style.opacity = "1";
header.style.pointerEvents = "auto"; // Hur många pixlar innan "main-content" som menyn ska börja synas
sidebar.style.pointerEvents = "auto"; const fadeStart = windowHeight * 0.2;
} else { const fadeEnd = windowHeight * 0.8;
header.style.opacity = "0";
sidebar.style.opacity = "0"; // Beräkna scrollbaserad opacitet (0 till 1)
let opacity = 1 - (contentY - fadeStart) / (fadeEnd - fadeStart);
opacity = Math.max(0, Math.min(1, opacity)); // begränsa mellan 0 och 1
// Tillämpa opacitet
header.style.opacity = opacity;
sidebar.style.opacity = opacity;
// Hantera klickbarhet så man inte klickar på osynlig meny
if (opacity < 0.05) {
header.style.pointerEvents = "none"; header.style.pointerEvents = "none";
sidebar.style.pointerEvents = "none"; sidebar.style.pointerEvents = "none";
} else {
header.style.pointerEvents = "auto";
sidebar.style.pointerEvents = "auto";
} }
} });
window.addEventListener("scroll", toggleMenuVisibility); window.addEventListener("load", () => {
window.addEventListener("load", toggleMenuVisibility); // Initiera rätt opacitet direkt vid sidladdning
window.dispatchEvent(new Event("scroll"));
});
</script> </script>
<!-- Bakgrundsbild med filter --> <!-- Bakgrundsbild med filter -->