Scroll Reveal

A Scroll Reveal kiterjesztés animálja az elemeket, amikor azok görgetés közben belépnek a látható területre. Az oldal egyes részei először rejtve vannak (vagy halványak, eltoltak), és fokozatosan jelennek meg, ahogy a látogató lefelé görget. Programozás nélkül működik az Elementorban és a blokkszerkesztőben is.

Miért lehet hasznos:

• fokozza a vizuális élményt,
• a tartalmon át vezeti a látogató figyelmét,
• hosszú oldalakat tesz dinamikusabbá, kevésbé nyomasztóvá.

Bekapcsolás

A Crocoblock → JetPlugins Settings → JetTricks → Widgets & Extensions → Avaliable Extensions részen kapcsold be a Scroll Reveal Extension kapcsolót.

Alkalmazás widgetre vagy blokkra

1. Nyisd meg az oldalt az Elementorban vagy a blokkszerkesztőben, és add hozzá vagy válaszd ki a kívánt elemet.
2. A Haladó fülön nyisd ki a JetTricks szakaszt.
3. Kapcsold be a Scroll Reveal kapcsolót.

https://minta-bolt.hu/wp-admin/post.php?post=6&action=elementor

A kapcsoló bekapcsolása után az Effect legördülő listából választhatod ki az animációt:

Effekt	Mit csinál
Fade Up	Az elem fokozatosan, felfelé mozogva jelenik meg.
Fade Down	Az elem halványul be, kissé lefelé mozogva.
Fade Left	Az elem balról csúszik be.
Fade Right	Az elem jobbról halványul be a végső helyére.
Zoom In	Az elem kisebb méretből nő meg megjelenés közben.
Zoom Out	Az elem nagyobb méretből ül a normál méretére.
Flip Up	Az elem felfelé fordul megjelenéskor, 3D-s hatást keltve.
Flip Out	Az elem elfordul, ahogy eltűnik vagy átmenetet tesz.
Mask	Az elem takarással (vágással) kerül elő: a tartalom fokozatosan bukkan elő egy rejtett területről.

További beállítások:

• Duration: az animáció időtartama.
• Delay: a várakozás az elem láthatóvá válása és az animáció kezdete között.
• Animate Once: bekapcsolva az animáció csak egyszer fut le. Kikapcsolva minden alkalommal újra lejátszódik, amikor az elem belép a látható területre.
• Viewport offset (px): mikor induljon az animáció a képernyő széléhez képest. Negatív értékkel korábban indul.
• Active On: mely eszközökön legyen érvényes az animáció.

A blokkszerkesztőben ugyanezek a beállítások érhetők el: nyisd ki a JetTricks részt, és kapcsold be a Scroll Reveal kapcsolót.

Konténerekre is alkalmazható (a konténer Haladó → JetTricks szakaszában a Scroll Reveal kapcsoló). Általában külön elemekre alkalmazva jobban szabályozható a sorrend és az élmény.

A Mask effekt

A Mask effekt filmszerű képmegjelenítést ad. Alkalmas például építészeti irodák vagy fotósok oldalára, ahol a munkák fotói fokozatosan bukkannak elő görgetéskor, hirtelen megjelenés helyett. Jó választás még:

• nyitóoldali (hero) bannerekhez,
• teljes szélességű galériaátmenetekhez,
• előtte/utána bemutatókhoz,
• terméket bemutató szakaszokhoz,
• történetmesélő nyitóoldalakhoz.

Mivel az animáció fokozatosan fedi fel a tartalmat, mélységet ad az oldalnak anélkül, hogy erőszakos mozgással terhelné.

Gyakori kérdések

Mi a különbség a Fade és a Mask effekt között? A Fade effektek átlátszósággal és mozgással (fel, le, balra, jobbra csúszva) jelenítik meg az elemet. A Mask takarással, vágással hozza elő a tartalmat. A Fade egyszerűbb és könnyebb, a Mask filmszerűbb, látványosabb.

Működik a Scroll Reveal Elementor nélkül, a blokkszerkesztőben? Igen, mindkét szerkesztőben működik. A blokkszerkesztőben a JetTricks szakaszban kapcsolhatod be a blokkhoz.

Alkalmazhatom egy egész szakaszra, vagy csak widgetekre? Egyes widgetekre, blokkokra, konténerekre vagy szakaszokra is, a szerkesztő felépítésétől függően.

Hogyan szabályozhatom az animáció sebességét és késleltetését? A Duration és a Delay beállítással a JetTricks szakaszban.

Ismétlődik az animáció minden görgetéskor? Az Animate Once beállítástól függ: bekapcsolva csak egyszer fut le, kikapcsolva minden belépéskor újra.

Befolyásolhatja az oldal teljesítményét? Sok animált elem egy oldalon kismértékben lassíthat, főleg gyengébb eszközökön. Használd válogatva, és ne alkalmazz nehéz effekteket minden elemre egyszerre.

Kikapcsolható mobilon? Igen, az Active On beállítással kiválaszthatod, mely eszközökön (asztali gép, tablet, mobil) jelenjen meg az animáció.