Scrollování

Návody, jak reagovat na rolování uživatele po stránce, scrollování zakázat nebo podle něj zvýrazňovat odkazy.

Všechny články z kategorie

Poskakování kvůli scrollbaru

Poskakování stránky kvůli posuvníku

Jak zabránit, aby obsah stránky poskakoval v závislosti na posuvníku.

Jak skrýt posuvník v <iframe>

Jak skrýt posuvník v <iframe>

Jak pomocí CSS skrýt scrollbar u stránky vložené přes <iframe>.

Jak funguje position: sticky

Jak funguje CSS position: sticky

CSS sticky posice umožňuje bez JS zafixovat element ke kraji okna při rolování.

Barva podle odrolování na stránce

Barva podle odrolování na stránce

Jak pouze v CSS měnit pozadí elementu v závislosti na odscrollování na stránce.

Zachování posice scrollování overflow-anchor

Zachování posice scrollování overflow-anchor

CSS vlastnost overflow-anchor umožňuje nastavit, jak si má prohlížeč pamatovat, kam bylo odscrollováno.

Šířka posuvníku

Šířka rolovací lišty

Jaká je šířka posuvníku v různých prohlížečích.

Vlastní styl posuvníku

Vlastní vzhled scrollbaru

Jaké jsou možnosti ve stylování vzhledu posuvníku.

Odrolování bez JavaScriptu

Odrolování bez JavaScriptu

Jak odscrollovat na určitou část stránky bez JavaScriptu.

Nekonečné rolování

Nekonečné scrollování

Je lepší nekonečné rolování, klasické stránkování nebo tlačítko „Zobrazit další“?

Jednostránkový web

Jednostránkový web

Kdy vytvářet web o jediné stránce. Jaké jsou výhody a nevýhody.

Přichytávací rolování v CSS

Přichytávací rolování v CSS

CSS vlastnost scroll-snap dokáže řídit rolování, aby přeskakovalo mezi jednotlivými elementy.

Detekce směru scrollování

Zjištění směru rolování

Jak JavaScriptem zjistit, jakým směrem uživatel na stránce roluje.

Odkaz na kotvu a fixní menu

Odkaz na kotvu a fixní hlavička

Při použití fixního menu/hlavičky se stane nepěkná věc, že při odkazu na kotvu je cíl skryt pod menu. Co s tím?

Změna location.hash bez odrolování stránky

Změna location.hash bez posunu stránky

Jak změnit location.hash bez posunutí stránky.

Zakázat rolování stránky

Jak zakázat scrollování na stránce

Někdy se hodí zamezit uživateli v rolování, jaké existují možnosti?

Zvýraznění podle rolování

Označení odkazu na kotvu, pokud je na ní odrolováno

U jednostránkových webů s fixní navigací (s odkazy na #kotvy) může být vhodné právě viditelnou (aktivní) položku zvýraznit.

Odrolování na element

Odrolování na určitý HTML tag

Nestačí-li běžné odrolování na HTML #kotvu, přichází na řadu JavaScript.

Zvýraznění aktivní kotvy

Zvýraznění aktivované kotvy (:target)

Pokud se v rámci stránky používají odkazy na jednotlivé #části, může být vhodné zvýrazněním ukázat, kam odkaz mířil.