Fix
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
This commit is contained in:
parent
1136df09e6
commit
7d54463e2e
|
@ -11,27 +11,53 @@ title: Start
|
||||||
window.scrollTo({ top: y, behavior: 'smooth' });
|
window.scrollTo({ top: y, behavior: 'smooth' });
|
||||||
}
|
}
|
||||||
|
|
||||||
// Göm knappen vid scroll
|
window.addEventListener('scroll', () => {
|
||||||
window.addEventListener('scroll', () => {
|
const button = document.getElementById('scrollButton');
|
||||||
const button = document.getElementById('scrollButton');
|
if (window.scrollY > 10) {
|
||||||
if (window.scrollY > 10) {
|
button.style.opacity = '0';
|
||||||
button.style.display = 'none';
|
button.style.pointerEvents = 'none';
|
||||||
}
|
} else {
|
||||||
});
|
button.style.opacity = '1';
|
||||||
|
button.style.pointerEvents = 'auto';
|
||||||
|
}
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
window.addEventListener('scroll', () => {
|
window.addEventListener("scroll", () => {
|
||||||
const header = document.querySelector('.md-header');
|
const content = document.getElementById("main-content");
|
||||||
const tabs = document.querySelector('.md-tabs');
|
const header = document.querySelector(".md-header");
|
||||||
if (window.scrollY > window.innerHeight * 0.8) {
|
const sidebar = document.querySelector(".md-sidebar");
|
||||||
header.style.transform = "translateY(0)";
|
|
||||||
if (tabs) tabs.style.transform = "translateY(0)";
|
const contentY = content.getBoundingClientRect().top;
|
||||||
|
const windowHeight = window.innerHeight;
|
||||||
|
|
||||||
|
// Hur många pixlar innan "main-content" som menyn ska börja synas
|
||||||
|
const fadeStart = windowHeight * 0.2;
|
||||||
|
const fadeEnd = windowHeight * 0.8;
|
||||||
|
|
||||||
|
// 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";
|
||||||
|
sidebar.style.pointerEvents = "none";
|
||||||
} else {
|
} else {
|
||||||
header.style.transform = "translateY(-100%)";
|
header.style.pointerEvents = "auto";
|
||||||
if (tabs) tabs.style.transform = "translateY(-100%)";
|
sidebar.style.pointerEvents = "auto";
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
window.addEventListener("load", () => {
|
||||||
|
// Initiera rätt opacitet direkt vid sidladdning
|
||||||
|
window.dispatchEvent(new Event("scroll"));
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<video autoplay loop muted playsinline
|
<video autoplay loop muted playsinline
|
||||||
|
|
|
@ -33,3 +33,9 @@
|
||||||
.md-tabs {
|
.md-tabs {
|
||||||
transition: transform 0.3s ease;
|
transition: transform 0.3s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#scrollButton {
|
||||||
|
transition: opacity 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue