Sorháttér widget: színek és színátmenetek

A Sorháttér widget a Mély réteg szakaszban három színes hátteret kínál: egy kétszínű színátmenetet, egy mozgó, többszínű színátmenetet és egy színről színre áttűnő hátteret. A widgetet abba a tárolóba (vagy klasszikus szakaszba) kell tenned, amelyik a hátteret kapja; a bekapcsolását és a rétegeket az áttekintő fejezet írja le. A widget a Pro bővítmény része.

Színátmenetes háttér

A színátmenet két színt olvaszt egybe a szakaszon, ezért kevésbé lapos, mint az egyszínű háttér. A Sorháttér lineáris vagy radiális színátmenetet ad a tárolónak.

1. A Sorháttér widgeten nyisd meg a Tartalom → Mély réteg szakaszt.
2. A Válaszd ki az opciót listában válaszd a Színátmenet színe elemet.
3. Válaszd ki a Szín 1 és a Szín 2 értékét, majd az 1. szín helye és a 2. szín helye csúszkával állítsd be, hol áll meg az egyes szín.
4. A Színátmenet stílusa lehet Lineáris (ekkor a Színátmenet szöge számít) vagy Radiális (ekkor a Pozíció adja meg, honnan indul a színátmenet).

https://minta-bolt.hu/h8-atmenet/

A képen a 90 fokos lineáris színátmenet a bal oldali Szín 1 (kék) és a jobb oldali Szín 2 (piros) között fut.

Beállítás	Mit csinál	Alapérték
Szín 1 és Szín 2	A színátmenet két színe.	narancs és ciánkék
1. szín helye és 2. szín helye	Hol áll meg az egyes szín, százalékban.	nincs
Színátmenet stílusa	Lineáris vagy Radiális.	Lineáris
Színátmenet szöge	A lineáris színátmenet iránya.	180 fok
Pozíció	A radiális színátmenet kiindulópontja.	Közép

• A színátmenet az egész tárolót kitölti a widgetek mögött. A 90 fokos lineáris színátmenet balról jobbra futott a Szín 1-től a Szín 2-ig.
• A bal felső pozíciójú radiális színátmenet a bal felső sarokból indult.
• A Felső réteg is tartalmaz Színátmenet színe opciót ugyanezekkel a beállításokkal. Az a többi réteg fölött van, ezért ott átlátszó színeket használj, ha azt szeretnéd, hogy az alatta lévők látsszanak.

Korlátozás: a színátmenet pontosan két színt használ. Mozgó, több színből álló színátmenethez a Színátmenet animálása opciót használd.

Hibaelhárítás. Ha a Színátmenet szögének változtatása nem hat, annak az az oka, hogy a szög csak a Lineáris színátmenetre vonatkozik. Radiális színátmenetnél a Pozíciót állítsd.

Mozgó színátmenet

A mozgó színátmenet lassan áthúzza a színeit a háttéren, ami jól mutat nyitóképernyők mögött. A Sorháttér a megadott színekből építi fel a színátmenetet, és mozgásban tartja, vagy egy tárolón belül, vagy a teljes oldal mögött.

1. A Sorháttér widgeten nyisd meg a Tartalom → Mély réteg szakaszt.
2. A Válaszd ki az opciót listában válaszd a Színátmenet animálása elemet.
3. A Több szín kiválasztása listában minden elemhez adj meg egy Színt. Az Elem hozzáadása gombbal vegyél fel újabb színeket.
4. Állítsd be az Animáció időtartamát (1 és 30 másodperc között, alapérték 15) és a Színátmenet forgatásának animálását (a színátmenet szöge, alapérték 120).
5. Ha a teljes oldalt be szeretnéd fedni, kapcsold be a Teljes oldalas háttér kapcsolót, és a Pozíció legyen Relatív.

https://minta-bolt.hu/h8-anim-atmenet/

A képen a színátmenet egy pillanatfelvétele látszik: a színek az animáció során folyamatosan továbbhaladnak.

Beállítás	Mit csinál	Alapérték
Több szín kiválasztása	A színátmenet színei sorrendben.	3 szín
Animáció időtartama	Egy animációs ciklus hossza, másodpercben.	15
Színátmenet forgatásának animálása	A színátmenet szöge fokban.	120
Teljes oldalas háttér	A színátmenetet nem a tároló, hanem az egész oldal mögé teszi.	Ki
Pozíció	Örökölt vagy Relatív. Teljes oldalas háttérhez a Relatív való.	Örökölt

• A színátmenet a tárolónál jóval nagyobb, és oda-vissza csúszik, ezért a színek áthúznak rajta. Négy színnel és 4 másodperces időtartammal a mozgás jól látszott.
• A Teljes oldalas háttér bekapcsolva a színátmenet az egész oldal mögé kerül, nem csak a tároló mögé. A panel ehhez az Elementor Canvas oldalelrendezést ajánlja.

Korlátozás: a Teljes oldalas háttér és az Örökölt pozíció együtt a színátmenet csak az oldal első képernyőjét fedte (egy 1800 pixeles oldal első 900 pixelét). Állítsd a Pozíciót Relatívra, hogy az egész oldalt befedje.

Hibaelhárítás.

• A teljes oldalas színátmenet az oldal felénél véget ér. Állítsd a Pozíciót Relatívra.
• A színátmenet túl lassan mozog. Csökkentsd az Animáció időtartamát.

Színváltó háttér

A lassan színről színre váltó háttér magára vonja a figyelmet, és nem kell hozzá semmilyen extra tartalom. A Sorháttér a tároló hátterét egy színlistán át áttűnteti, újra és újra.

1. A Sorháttér widgeten nyisd meg a Tartalom → Mély réteg szakaszt.
2. A Válaszd ki az opciót listában válaszd az Animált háttérszín elemet.
3. A Több szín kiválasztása listában nyisd ki az elemeket, és mindegyiknél válaszd ki a Színt. Három elem már alapból van, az Elem hozzáadása gombbal többet is felvehetsz.
4. Add meg az Animáció időtartamát ezredmásodpercben (alapérték 3000).

https://minta-bolt.hu/h8-anim-szin/

A képen a háttér a zöld, kék és lila színek közül éppen az egyiknél jár: a szín folyamatosan továbbváltozik.

• A háttér az első színnel indul, áttűnik a következőre, majd azután a következőre, és az utolsó után újrakezdi.
• Az Animáció időtartama azt adja meg, hogy milyen gyakran indul a következő színre váltás. Maga az áttűnés mindig nagyjából három másodpercig tart, ezért 3000 alatti értéknél (2000-rel próbálva) a színek folyamatosan keverednek, és egyik szín sem áll meg.
• A Kép kiválasztása mező az elemekben ennél az opciónál nem használt: a Háttéranimáció görgetéskor opcióhoz tartozik.

Korlátozások:

• Az áttűnés hossza nem módosítható, csak a színváltások közötti idő.
• A színek tömör kitöltésként váltanak. Mozgó, többszínű színátmenethez a Színátmenet animálása opciót használd.

Hibaelhárítás. Ha a háttér sosem mutat tiszta színt, állítsd az Animáció időtartamát 3000 fölé, például 5000-re, hogy minden színnek legyen ideje teljesen átúszni.