Przejdź do zawartości

MediaWiki:Common.js: Różnice pomiędzy wersjami

Z Horyzont Zdarzeń
Nie podano opisu zmian
Znacznik: Wycofane
Nie podano opisu zmian
Znacznik: Wycofane
Linia 1: Linia 1:
// === Przycisk "Wróć na górę" z SVG ===
// === Przycisk "Wróć na górę" z SVG ===
const scrollButton = document.createElement("button");
$(document).ready(function () {
scrollButton.id = "scrollTopBtn";
    const scrollButton = document.createElement("button");
scrollButton.title = "Wróć na górę";
    scrollButton.id = "scrollTopBtn";
scrollButton.innerHTML = `
    scrollButton.title = "Wróć na górę";
<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">
    scrollButton.innerHTML = `
    <line x1="12" y1="19" x2="12" y2="5"></line>
    <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">
    <polyline points="5 12 12 5 19 12"></polyline>
        <line x1="12" y1="19" x2="12" y2="5"></line>
</svg>
        <polyline points="5 12 12 5 19 12"></polyline>
`;
    </svg>
document.body.appendChild(scrollButton);
    `;
 
    document.body.appendChild(scrollButton);
// Akcja kliknięcia – scroll do góry
scrollButton.onclick = () => {
    window.scrollTo({ top: 0, behavior: 'smooth' });
};


$(document).ready(function () {
    // Scroll to top
    const scrollBtn = document.getElementById("scrollTopBtn");
    scrollButton.addEventListener("click", () => {
        window.scrollTo({ top: 0, behavior: 'smooth' });
    });


    // Scroll behavior
     window.addEventListener("scroll", () => {
     window.addEventListener("scroll", () => {
        const btn = document.getElementById("scrollTopBtn");
         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;
        const scrollY = window.pageYOffset || document.documentElement.scrollTop;


         // Widoczność przycisku
         // Pokaż/ukryj przycisk
         if (scrollY > 300) {
         btn.style.display = scrollY > 300 ? "flex" : "none";
            scrollBtn.style.display = "flex";
            scrollBtn.style.alignItems = "center";
            scrollBtn.style.justifyContent = "center";
        } else {
            scrollBtn.style.display = "none";
        }


         // Unikaj nakładania na stopkę
         // Przesuń jeśli nad stopką
         if (scrollY + windowHeight > bodyHeight - footerHeight) {
         if (scrollY + windowHeight > bodyHeight - footerHeight) {
             scrollBtn.style.bottom = (footerHeight + 20) + "px";
             btn.style.bottom = `${footerHeight + 20}px`;
         } else {
         } else {
             scrollBtn.style.bottom = "160px";
             btn.style.bottom = "160px";
         }
         }
     });
     });
});
});

Wersja z 13:47, 1 maj 2025

// === Przycisk "Wróć na górę" z SVG ===
$(document).ready(function () {
    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);

    // Scroll to top
    scrollButton.addEventListener("click", () => {
        window.scrollTo({ top: 0, behavior: 'smooth' });
    });

    // Scroll behavior
    window.addEventListener("scroll", () => {
        const btn = document.getElementById("scrollTopBtn");
        const footer = document.querySelector(".mw-footer");
        const footerHeight = footer ? footer.offsetHeight : 0;
        const windowHeight = window.innerHeight;
        const bodyHeight = document.body.scrollHeight;
        const scrollY = window.pageYOffset || document.documentElement.scrollTop;

        // Pokaż/ukryj przycisk
        btn.style.display = scrollY > 300 ? "flex" : "none";

        // Przesuń jeśli nad stopką
        if (scrollY + windowHeight > bodyHeight - footerHeight) {
            btn.style.bottom = `${footerHeight + 20}px`;
        } else {
            btn.style.bottom = "160px";
        }
    });
});