← Wszystkie wpisy

Poradniki

Ujarzmij sticky elementy, które zasłaniają treść

15 maja 2026 · autor JustZix Team

Sticky nagłówek, który zostaje 90 px wysoki podczas scrolla. Pływający pasek „zapisz się do newslettera". Przycisk „do góry" zasłaniający ostatnie zdanie akapitu. Elementy przyklejone do ekranu potrafią zjeść jedną trzecią widoku. Oto jak je ujarzmić.

Co je przykleja

Dwie właściwości CSS: position: sticky (element przykleja się, gdy doscrollujesz do jego miejsca) i position: fixed (element tkwi w miejscu od początku). Obie da się nadpisać.

Dwa podejścia

Odklej — element zostaje, ale przewija się razem ze stroną. Dobre dla nagłówków, które są przydatne, tylko nie muszą być wiecznie na wierzchu.

header, .site-header, .navbar,
[class*="sticky"], [class*="fixed"] {
  position: static !important;
}

Ukryj — element znika całkiem. Dobre dla pływających CTA, widgetów „do góry", pasków promocyjnych.

[class*="back-to-top"], [class*="scroll-top"],
[class*="sticky-cta"], [class*="floating-bar"] {
  display: none !important;
}

Jak znaleźć winowajcę

Nie wiesz, który element jest przyklejony? Otwórz JS Console JustZix i wpisz:

[...document.querySelectorAll('*')]
  .filter(el => {
    const p = getComputedStyle(el).position;
    return p === 'fixed' || p === 'sticky';
  })
  .forEach(el => console.log(el));

Konsola wypisze wszystkie elementy fixed i sticky — najedź na każdy, żeby zobaczyć go na stronie, i przepisz jego klasę do selektora reguły.

Pułapki

• Odklejenie nagłówka bywa kosmetycznie kosztowne. Część layoutów liczy na to, że nagłówek jest fixed; po position: static treść pod nim może podskoczyć. Zwykle akceptowalne, ale sprawdź.
• Nie każdy sticky jest zły. Sticky spis treści albo pasek postępu czytania bywają pożyteczne — celuj precyzyjnie, nie hurtem.
• Selektory po fragmencie klasy. [class*="fixed"] trafi też w .fixed-width, który z pozycjonowaniem nie ma nic wspólnego. position: static na nim nic nie psuje, ale warto wiedzieć.

Zobacz też

• Przykłady — snippet ukrywania czat-widgetów i inne
• Ukryj cookie bannery — pokrewne sprzątanie natrętnych elementów
• Reader mode własnej roboty — sprzątanie strony do końca

Zainstaluj JustZix — i odzyskaj ekran zajęty przez przyklejone paski.