MagyarmagyarHeading Animation widget: váltakozó szöveg
A Heading Animation widget hat animációs stílusa: gépelő és forgó szöveghatás, előtag, animált szöveg és utótag.
A forgó szöveghatás egy mondatban egy szót vagy kifejezést cserél le a következőre ugyanazon a helyen, miközben a mondat többi része áll. A Heading Animation widget Style 2 stílusával építheted meg.
Használat előtt kapcsold be: The Plus Addons → Widgets, keress rá a Heading Animation szóra, és kapcsold be. A widget összes tartalmi és stílusbeállítása az ingyenes bővítményben van.
A hatás elkészítése
Szekció neve “A hatás elkészítése”- Húzd a Heading Animation widgetet az oldalra.
- A Text Animation szakaszban az Animation Style résznél válaszd a Style 2 stílust: ez a felső sor második képes csempéje.
- A Prefix Text mezőbe írd a váltakozó szöveg előtti állandó szavakat.
- Az Animated Text mezőbe írd a kifejezéseket, mindegyiket külön sorba. Új sort a Ctrl + Enter vagy a Shift + Enter billentyűvel kezdhetsz.
- A Postfix Text mezőbe írd a váltakozó szöveg utáni állandó szavakat, majd frissítsd az oldalt.
A képen a Style 2 csempe ki van választva, az Animated Text mezőben három kifejezés áll egymás alatt.
Mit látsz az oldalon
Szekció neve “Mit látsz az oldalon”Az oldalon egyszerre egy kifejezés látszik: az aktuális elhalványul, a következő a helyén megjelenik. Az előtag és az utótag végig a helyén marad.
A képen az előtag („Ez egy”) és az utótag („szöveg”) között a váltakozó kifejezés áll, háttérrel kiemelve.
A hat animációs stílus
Szekció neve “A hat animációs stílus”Az Animation Style hat képes csempéje közül választasz. Az Import Presets gomb a csempék felett kész, szerkeszthető dizájnt tölt be.
| Stílus | Mit látsz az oldalon |
|---|---|
| Style 1 (gépelés) | A kifejezés betűnként törlődik, a következő betűnként íródik be |
| Style 2 (forgás) | Az aktuális kifejezés elhalványul, a következő a helyére „esik” |
| Style 3 (nagyítás) | A kifejezések elmosódással és méretváltással úsznak át egymásba |
| Style 4 (aláhúzás) | A kifejezések cserélődnek, közben vékony sáv nő alattuk |
| Style 5 (csúsztatás) | A következő kifejezés oldalról csúszik be a helyére |
| Style 6 (betűcsere) | A betűk egyenként kicsinyednek és nagyodnak vissza |
Gépelő (typewriter) hatás
Szekció neve “Gépelő (typewriter) hatás”A gépelő hatást az 1. stílus adja, ez az alapértelmezett.
- Húzd a Heading Animation widgetet az oldalra, és hagyd az Animation Style értékét Style 1-en.
- A Prefix Text mezőbe írd az állandó szavakat, például „Gyors ”.
- Az Animated Text mezőbe írd a begépelendő kifejezéseket soronként.
- A Postfix Text mezőbe írd a végén álló szöveget, majd frissítsd az oldalt.
A panelen az Animation Style első csempéje van kijelölve, az Animated Text mezőben három kifejezés áll.
A képen az előtag („Gyors”) és az utótag („építünk.”) áll, a kifejezés a szürke háttérrel kiemelt blokkban íródik be.
Ha nem íródik be semmi, ellenőrizd, hogy az Animation Style a Style 1, és hogy a kifejezések az Animated Text mezőben vannak, soronként egy. A 2-6. stílus másképp mozog.
Stílus és korlátok
Szekció neve “Stílus és korlátok”- Az On Scroll View Animation a teljes widgetet animálja, ahogy a látótérbe görget az oldal.
- Az 1-5. stílusban az animált szó mögötti szürke blokk az Animation Background Color. Csak a 6. stílusnak nincs háttérblokkja.
- A 4. stílus aláhúzása alapbeállításnál átlátszó, és mindig az animált szöveg betűszínét (Font Color) használja. Állítsd be a Stílus fül Animated Text szakaszában a Font Color értékét, különben nem látszik az aláhúzás, és külön színe nem lehet.
- Ha szürke doboz van a szavak mögött, azt az Animation Background Color adja: állítsd a dizájnodhoz.
Beállítások
Szekció neve “Beállítások”| Beállítás | Mit csinál | Alapérték |
|---|---|---|
| Animation Style | Hat képes csempe, a hatás stílusa. A forgó hatás a Style 2 | Style 1 |
| Prefix Text | A váltakozó rész előtti állandó szöveg | This is |
| Animated Text | A váltakozó kifejezések, soronként egy | Heading |
| Animated Text Tag | A váltakozó rész HTML-címkéje | H1 |
| Postfix Text | A váltakozó rész utáni állandó szöveg | Animation |
| Alignment | A blokk igazítása | Középre |
Stílus
Szekció neve “Stílus”A Stílus fülön a váltakozó szöveget az Animated Text résznél állíthatod: Font Color (betűszín), Typography (tipográfia) és Animation Background Color (az animált szöveg háttérszíne, alapértéke szürke). Az előtag és az utótag színe külön szakaszban állítható.
Készült: