MediaWiki:Common.js: Różnice pomiędzy wersjami
Wygląd
Znacznik: Anulowanie edycji |
Znacznik: Anulowanie edycji |
||
| Linia 1: | Linia 1: | ||
// === Przycisk "Wróć na górę" z SVG === | // === Przycisk "Wróć na górę" z SVG === | ||
const scrollButton = document.createElement("button"); | |||
scrollButton.id = "scrollTopBtn"; | |||
scrollButton.title = "Wróć na górę"; | |||
scrollButton.innerHTML = ` | |||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="#1a1a1a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-up"> | |||
<line x1="12" y1="19" x2="12" y2="5"></line> | |||
<polyline points="5 12 12 5 19 12"></polyline> | |||
</svg> | |||
`; | |||
document.body.appendChild(scrollButton); | |||
// Akcja kliknięcia – scroll do góry | |||
scrollButton.onclick = () => { | |||
window.scrollTo({ top: 0, behavior: 'smooth' }); | |||
}; | |||
$(document).ready(function () { | $(document).ready(function () { | ||
const | const scrollBtn = document.getElementById("scrollTopBtn"); | ||
window.addEventListener("scroll", () => { | window.addEventListener("scroll", () => { | ||
const footer = document.querySelector(".mw-footer"); | const footer = document.querySelector(".mw-footer"); | ||
const footerHeight = footer ? footer.offsetHeight : 0; | const footerHeight = footer ? footer.offsetHeight : 0; | ||
const scrollY = window.scrollY; | |||
const windowHeight = window.innerHeight; | const windowHeight = window.innerHeight; | ||
const bodyHeight = document.body.scrollHeight; | const bodyHeight = document.body.scrollHeight; | ||
// | // Widoczność przycisku | ||
if (scrollY > 300) { | |||
scrollBtn.style.display = "flex"; | |||
scrollBtn.style.alignItems = "center"; | |||
scrollBtn.style.justifyContent = "center"; | |||
} else { | |||
scrollBtn.style.display = "none"; | |||
} | |||
// | // Unikaj nakładania na stopkę | ||
if (scrollY + windowHeight > bodyHeight - footerHeight) { | if (scrollY + windowHeight > bodyHeight - footerHeight) { | ||
scrollBtn.style.bottom = (footerHeight + 20) + "px"; | |||
} else { | } else { | ||
scrollBtn.style.bottom = "160px"; | |||
} | } | ||
}); | }); | ||
}); | }); | ||
Wersja z 21:36, 4 maj 2025
// === Przycisk "Wróć na górę" z SVG ===
const scrollButton = document.createElement("button");
scrollButton.id = "scrollTopBtn";
scrollButton.title = "Wróć na górę";
scrollButton.innerHTML = `
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="#1a1a1a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-up">
<line x1="12" y1="19" x2="12" y2="5"></line>
<polyline points="5 12 12 5 19 12"></polyline>
</svg>
`;
document.body.appendChild(scrollButton);
// Akcja kliknięcia – scroll do góry
scrollButton.onclick = () => {
window.scrollTo({ top: 0, behavior: 'smooth' });
};
$(document).ready(function () {
const scrollBtn = document.getElementById("scrollTopBtn");
window.addEventListener("scroll", () => {
const footer = document.querySelector(".mw-footer");
const footerHeight = footer ? footer.offsetHeight : 0;
const scrollY = window.scrollY;
const windowHeight = window.innerHeight;
const bodyHeight = document.body.scrollHeight;
// Widoczność przycisku
if (scrollY > 300) {
scrollBtn.style.display = "flex";
scrollBtn.style.alignItems = "center";
scrollBtn.style.justifyContent = "center";
} else {
scrollBtn.style.display = "none";
}
// Unikaj nakładania na stopkę
if (scrollY + windowHeight > bodyHeight - footerHeight) {
scrollBtn.style.bottom = (footerHeight + 20) + "px";
} else {
scrollBtn.style.bottom = "160px";
}
});
});