Parallax web design

Aktualizováno: 29. 11. 2020, datum vydání: 6. 1. 2017

Parallax design může být vytvořen například pomocí javascriptové knihovny skrollr.js. Pro začátky jde o jednodušší řešení parallaxu. Při použití parallaxu se jednotlivé vrstvy na HTML stránce hýbou při skrolování myší jinou rychlostí a lze tak vytvořit např. 3D efekt.

Skrollr

Skrollr se lze snáze naučit, ale umí toho méně. Podstatně komplexnější knihovna je např. ScrollMagic (viz Skrollr vs ScrollMagic – porovnání knihoven, vítězí ScrollMagic).

Knihovna ke stažení a její dokumentace

Při používání prvků parallaxu se do HTML tagů přidávají informace formou HTML data-* Attributes. Jde o data, na která si může následně javascript v knihovnách načíst. Řeší se tím typicky pozicování prvků a další jejich vlastnosti viz Skrollr Cheatsheet. Klíčové pro používání je pochopit absolutní a relativní pozicování ve skrolleru.

Tutoriály

Další články