# Sorháttér widget: háttérkép, parallax és mozgó képek

> Parallax háttérkép, egeres dőlés, Ken-Burns-zoom, önmagától mozgó képrétegek és görgetésre mozduló képek a Sorháttér widgettel.

A **Sorháttér** widget a háttérképet mozgásba hozhatja: görgetésre eltolhatja, az egérrel megdöntheti, lassan ráközelíthet, vagy egész képeket gördíthet át a szakaszon. Az alapokat (a widget bekapcsolását és a rétegeket) a [Sorháttér widget: áttekintés, rétegek és fedőréteg](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/kepek-media-hatter-attekintes/) fejezet írja le. A widget a Pro bővítmény része, és abba a tárolóba kell tenned, amelyik a hátteret kapja.

## Parallax háttérkép

A parallax háttér a képet más ütemben mozgatja, mint a tartalmat, ezért görgetéskor mélység érzetét kelti.

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 **Kreatív háttérkép** elemet, és a **Háttérkép** mezőben válaszd ki a képet. Szükség szerint állítsd a **Kép pozíciója**, **Melléklet**, **Ismétlés** és **Háttér mérete** értékét.
3. A **Háttéreffektus** maradjon **Normál háttérkép** értéken. Ha azt szeretnéd, hogy a kép kövesse az egeret, a **Különleges képeffektusok rámutatáskor** listából válaszd a **Parallax dőlési effektus** vagy a **Parallax mozgási effektus** elemet.
4. Kapcsold be a **Parallax görgetéskor** kapcsolót a görgetéses hatáshoz.
5. Ha szeretnél, kapcsold be a **Ken-Burns-effektus** kapcsolót a lassú ráközelítéshez, és a **Reszponzív kép** kapcsolót, hogy táblagépen és telefonon másik képet mutass.

![Parallax háttérkép egy szakaszban, görgetés közben](./kepek/kepek-media-hatter-parallax.webp)

*Parallax háttérkép egy szakaszban, görgetés közben* (https://minta-bolt.hu/h8-parallax/)

A képen a tároló a lap közepére görgetve látszik: a háttérkép a tárolóhoz képest elcsúszik, ez a parallax.

| Beállítás | Mit csinál | Alapérték |
|---|---|---|
| **Melléklet** | A **Rögzített** érték egy helyben tartja a képet, miközben az oldal elhalad előtte. | **Görgetés** |
| **Háttéreffektus** | **Normál háttérkép** vagy **Automatikusan mozgó háttérkép**. | **Normál háttérkép** |
| **Különleges képeffektusok rámutatáskor** | **Parallax dőlési effektus** vagy **Parallax mozgási effektus**, a **Parallax intenzitása** értékkel (20 és 100 között). | nincs |
| **Parallax görgetéskor** | A képet függőlegesen eltolja, ahogy a tároló áthalad a képernyőn. | Ki |
| **Mágikus görgetés** | A képet egy **Kezdő pozíció** és egy **Végső pozíció** között mozgatja görgetés közben. | Ki |
| **Ken-Burns-effektus** | Lassú ráközelítés; az **Effektus iránya** **Normál** vagy váltakozó, az **Effektus időtartama (sebesség)** másodpercben adható meg. | Ki, 15 |
| **Reszponzív kép** | Külön kép a **Tablet** és a **Mobil** fülön. | Ki |

### Hogyan viselkedik

- A **Parallax görgetéskor** bekapcsolva a kép pozíciója nagyjából 35 százalékról 80 százalékra változott felülről lefelé, ahogy a tároló végighaladt a képernyőn.
- **Rögzített** melléklettel a kép nem mozdul, a tároló pedig ablakként működik rajta.
- A **Parallax dőlési effektus** megdönti, a **Parallax mozgási effektus** eltolja a képet az egér mozgásával. Ha az egér elhagyja a területet, a kép nagyjából három másodperc alatt visszaáll.
- 6 másodperces időtartammal a **Ken-Burns-effektus** a képet nagyjából 127 százalékra nagyította, majd újraindult.
- **Reszponzív kép** esetén az 1024 pixeles képernyő még az asztali képet, a 800 és a 767 pixeles a táblagépes, a 390 pixeles a mobilos képet mutatta.
- A **Mágikus görgetés** csak azután mozgatja a képet, hogy a tároló teteje átlépte a képernyő közepét. Az oldal tetején lévő tároló már az oldal megnyitásakor túl van ezen.

### Korlátozás

A **Mágikus görgetés** a megadott távolságnak csak a felét mozgatja, ellenkező irányba: a **Végső pozíció** Y értéke −50 volt, és a kép 25 pixelt mozdult lefelé.

### Hibaelhárítás

**A Mágikus görgetés nem csinál semmit.** A tároló valószínűleg az oldal tetején van. A mozgás addig fut, amíg a tároló a képernyő közepén halad át, ezért az oldal lejjebb lévő szakaszain látszik jól.

## Önmagától mozgó képek

Egy lassan átgördülő háttérkép mozgást ad a szakasznak videó nélkül. A **Sorháttér** egy vagy több képet is végtelenül mozgathat, a megadott irányba és sebességgel.

1. A **Sorháttér** widgeten nyisd meg a **Tartalom → Középső réteg** szakaszt.
2. A **Válaszd ki az opciót** listában válaszd az **Automatikusan mozgó réteg** elemet.
3. Nyisd ki az első elemet, a **Kép feltöltése** mezőben válaszd ki a képet, és állítsd be a **Háttér mérete** értékét.
4. Válassz **Irányt** (**Jobb**, **Bal**, **Felül** vagy **Alul**), majd állítsd be a **Kép átlátszatlanságát** és az **Átmenet sebességét**.
5. Az **Elem hozzáadása** gombbal vegyél fel további mozgó képeket. A felső képeknek adj 1-nél kisebb átlátszatlanságot, hogy az alattuk lévők is látsszanak.

![Két, különböző irányba mozgó képréteg a háttérkép fölött, az egyik félig átlátszó](./kepek/kepek-media-hatter-mozgo-kepek.webp)

*Két, különböző irányba mozgó képréteg a háttérkép fölött, az egyik félig átlátszó* (https://minta-bolt.hu/h8-mozgo/)

A képen a piros kör és a kék háromszög két külön mozgó elem: a háromszög félig átlátszó, ezért az alatta lévő kép áttűnik rajta.

Egyetlen háttérképet a **Mély rétegből** is mozgathatsz: válaszd a **Kreatív háttérkép** elemet, a **Háttéreffektus** legyen **Automatikusan mozgó háttérkép**, majd válaszd ki a **Mozgás irányát** és az **Átmenet sebességét**.

| Beállítás | Mit csinál | Alapérték |
|---|---|---|
| **Irány** | A mozgás iránya: **Jobb** jobbra, **Felül** a tetejétől lefelé viszi a képet. | **Nincs** (balra mozog) |
| **Kép átlátszatlansága** | A kép átlátszósága, 0 és 1 között. | nincs |
| **Átmenet sebessége** | Minél nagyobb az érték, annál gyorsabb a mozgás (−100 és 100 között). | üres (a leglassabb pozitív sebesség) |
| **Reszponzív láthatóság** | Asztali gép, **Tablet** és **Mobil** kapcsoló az elemhez. | Ki |

### Hogyan viselkedik

- A kép ismétlődik, és megállás nélkül, egyszerre egy pixelt mozdul.
- Az 50-es sebesség a képet 2,5 másodperc alatt nagyjából 50 pixelre, a 90-es nagyjából 260 pixelre mozgatta, az üres sebesség pedig nagyjából 26 pixelre.
- Több elem egymástól függetlenül mozog, mindegyik a saját irányába és sebességével.

### Korlátozások

- A **Reszponzív láthatóság** nem rejti el az **Automatikusan mozgó réteg** képeit: kikapcsolt asztali és mobil kapcsolóval a kép 1200, 800 és 390 pixelen is látszott.
- A 0 alatti **Átmenet sebessége** lassít, nem fordítja meg a mozgást. Az irányt az **Irány** listával változtasd.

### Hibaelhárítás

**A kép rossz irányba mozog.** Állítsd be kifejezetten az **Irányt**: a **Nincs** érték balra mozgatja a képet.

**Csak a legfelső kép látszik.** Csökkentsd a fölötte lévő elemek **Kép átlátszatlanságát**, hogy az alsók áttűnjenek.

## Görgetésre mozduló képek

Ha a háttérben a képek a görgetéssel különböző ütemben vándorolnak, halványulnak vagy forognak, az oldal rétegzett és élő hatású. A **Sorháttér** a parallax háttérképet extra képekkel kombinálja, amelyek görgetéskor mozognak.

1. Add hozzá a **Sorháttér** widgetet a tárolóhoz. A **Tartalom → Mély réteg** szakaszban válaszd a **Kreatív háttérkép** elemet, adj meg egy **Háttérképet**, és kapcsold be a **Parallax görgetéskor** kapcsolót.
2. Nyisd meg a **Középső réteg** szakaszt, és válaszd a **Modern képeffektus** elemet.
3. Nyisd ki az első elemet, és a **Kép feltöltése** mezőben válaszd ki a képet.
4. Az asztali fülön helyezd el a képet: például kapcsold be a **Jobb (automatikus / %)** értéket 5-tel, a **Fent (automatikus / %)** értéket 15-tel, és add meg 350 pixeles **Szélességet**. Ha szeretnél, válassz animációt a **Képeffektusok** listából.
5. Kapcsold be a **Mágikus görgetés** kapcsolót. A **Görgetési opciók** mellett a ceruzára kattintva állítsd be az **Eltolást** és az **Időtartamot**, majd a **Kezdeti** és **Végső** fülön a kezdő és a végpontot.

![A képréteg a háttérkép fölött görgetés közben, a Képek görgetéskor feliratú szakaszban](./kepek/kepek-media-hatter-gorgetes-effekt.webp)

*A képréteg a háttérkép fölött görgetés közben, a Képek görgetéskor feliratú szakaszban* (https://minta-bolt.hu/h8-gorgetes-effekt/)

A képen a lebegő piros kör a **Modern képeffektus** eleme: görgetéskor eltolódik, miközben a háttérkép a parallax szerint mozog.

Az **Elem hozzáadása** gombbal további képeket vehetsz fel, mindegyiknek külön pozícióval és görgetési beállítással.

### Hogyan viselkedik

- A **Mágikus görgetés** akkor indul, amikor a tároló teteje eléri a képernyő közepét, és az **Időtartam** értékének megfelelő pixelnyi görgetésen át fut (alapérték 300). Visszagörgetve fordítva játszódik le.
- −200-as **Végső pozíció** (Y), 0,3-es átlátszatlanság és 600-as **Időtartam** mellett a kép nagyjából 100 pixelt mozdult lefelé, és 30 százalékra halványult, miközben az oldal 600 pixelt görgetett.
- A **Képeffektusok** (**Pulzálás**, **Lebegtetés**, **Dobálás**, **Forgó**) görgetéstől függetlenül folyamatosan futnak, az **Időtartam** pedig a sebességüket adja (alapérték 2,5 másodperc).

### Korlátozások

- A **Mágikus görgetés** a megadott távolság felét mozgatja, az ellenkező irányba (−200 mellett a kép 100 pixelt mozdult lefelé).
- Az oldal tetején lévő tároló az oldal megnyitásakor már túl van a képernyő közepén, ezért a **Mágikus görgetése** látható mozgást nem ad.
- A **Forgó** effektus **Transzformáció origója** nincs hatással: a kép mindig a közepe körül forog.
- A **Reszponzív láthatóság** **Mobil** kapcsolójának kikapcsolása nem rejtette el a képet a 390 pixeles képernyőn (a **Tablet** kikapcsolása 800 pixelen elrejtette).

### Hibaelhárítás

**A kép nem mozdul görgetéskor.** Tedd lejjebb a szakaszt az oldalon, vagy növeld az **Időtartamot**, hogy a hatás hosszabb görgetésen át fusson.