Jak používat animaci při posouvání ve webovém designu

Animace při posouvání je základní efekt načítání a posouvání webových stránek. Můžete jej přidat tak, že vyberete prvek a poté přejdete na panel vlastností. Klikněte na odkaz Při posouvání a zaškrtněte políčko Animace. Vyberte předvolbu a v případě potřeby přizpůsobte efekt při posouvání. V náhledu uvidíte efekt animace při posouvání.
On-Scroll animace

Browse By Feature Categories

Animace smyčky

Dnes má mnoho webových stránek animované prvky sloužící k upoutání pozornosti zvýšením návštěvnosti, zlepšením značky a přidáním jedinečnosti webových stránek. Nicepage umožňuje webovým designérům, profesionálům a nováčkům vytvářet bloky bohaté na animace bez kódování. Můžete povolit vlastnost Animace smyčky na panelu vlastností a přidat na svůj web animaci a interakci, čímž do vizuálního editoru webových stránek přenesete výkon JavaScriptu a CSS.

Přizpůsobení animace

Předpokládejme, že standardní animační efekty jsou pro vaši představu webu příliš malé a že k dosažení požadovaného výsledku potřebujete smíchat několik animačních efektů. Můžete plně ovládat vlastnosti dostupné pro přizpůsobitelné přednastavení animace. A vyberte pouze přednastavené přednastavení animace z knihovny s minimálním doladěním. Můžete přejít na panel vlastností a přizpůsobit všechny vlastnosti efektů Fade, Move, Zoom, Roll, Rotate a Spiral.

Předvolby animace

Můžete použít předvolby Animation On Scroll. A existují dva typy: Customizable Animation Presets, jejichž vlastnosti můžete plně upravovat, Predesigned Animation Presets, které si můžete vybrat pouze z Library a mají minimální jemné doladění.

Efekt animace Fade

Efekt blednutí je stylistický přechod, při kterém prvek, jako je obrázek, text nebo pozadí, postupně zmizí a zobrazí se zpět na webové stránce. Efekt slábnutí můžete nastavit výběrem prvku a výběrem Animace při rolování na panelu vlastností.

Efekt animace snímku

Přidejte efekt, pokud chcete, aby se váš prvek při načítání nebo posouvání stránky postupně pohyboval z jednoho bodu do druhého určitým směrem. Určete Efekt snímku přidáním, výběrem prvku a kliknutím na Přednastavení snímku v části Animace při rolování na panelu Vlastnosti.

Efekt animace přiblížení

Efekt zvětšení je přechod postupného vzhledu při změně velikosti prvku. Umožňuje zavřít prvek při načítání nebo rolování webové stránky.

Efekt převrácení animace

Aplikujte efekt převrácení k implementaci polovičního otočení prvku, přičemž můžete vidět přední i zadní stranu aktuálního prvku. Překlápěcí pól si můžete vybrat buď podle osy X nebo osy Y. Můžete vybrat prvek a poté přednastavení převrácení pro animaci při posouvání na panelu vlastností.

Efekt animace Bounce

Pomocí efektu Bounce Animation se prvek při posouvání stránky pohybuje dolů, nahoru a zase rychle dolů. Animaci odskoku při posouvání můžete povolit kliknutím na odpovídající předvolbu v části Animace při posouvání na panelu vlastností.

Efekt animace otáčení

Efekt otočení definuje transformaci, která otočí prvek kolem pevného bodu na stránce bez deformace. Tento efekt je také dostupný jako přednastavení, které najdete v části Animace při rolování na panelu vlastností.

Efekt animace boxu

The Box, nebo Jack In The Box, Vytváří přechodový efekt napodobující oblíbený pohyb vtipné hračky. Začíná to centrálním prolínáním a pokračuje třesením z jedné strany na druhou.

Efekt animace Flash

Flash animace, také spojená s mrkáním, je také populární, aby přilákala pozornost návštěvníků. Vypadá to jako série přechodů zatmívání a slábnutí s důrazem na neprůhlednost animovaného objektu nebo textu.

Efekt animace pantu

Pomocí efektu závěsu se prvek převrátí nebo způsobí převrácení náhlým rychlým pohybem, který se zastaví v místě představitelného závěsu. Tento přirozený přechod může přidat překvapení k interakci ve vašem webovém designu.