# Navigation Menu Lite: almenü nyitása hoverre vagy kattintásra

> Hogyan nyíljon a lenyíló almenü a Navigation Menu Lite widgetben: rámutatásra vagy kattintásra, a hozzá tartozó beállítások és korlátok.

A **Navigation Menu Lite** widgetben egyetlen beállítás dönti el, hogyan nyílnak a lenyíló almenük: a **Menu Hover/Click**. Az egész widgetre érvényes. Az alapérték a **Hover Sub-Menu**, a kattintásos nyitáshoz a **Click Sub-Menu** kell.

A beállítás előfeltételei: a widget be van kapcsolva a **The Plus Addons → Widgets** oldalon, van elkészített menü a **Megjelenés → Menük** alatt, és a menünek van legalább egy almenüje. Almenüt úgy hozol létre, hogy a **Menük** oldalon az elemet kicsit jobbra húzod egy másik elem alá: így lesz gyermekelem.

| Beállítás | Hol | Mit csinál | Alapérték |
| --- | --- | --- | --- |
| **Menu Hover/Click** | Tartalom → Extra Options | A **Hover Sub-Menu** a kurzor érkezésére nyitja a lenyílót, a **Click Sub-Menu** kattintásra nyitja és nyitva tartja. | **Hover Sub-Menu** |
| **Menu Effects** | Tartalom → Navigation Bar | A **Style 1** lecsúsztatja, a **Style 2** áttűnéssel mutatja a panelt. | **Style 1** |
| **Main Menu Indicator Style** | Stílus → Main Menu | Nyilat tesz a lenyílót tartalmazó elemek mellé, hogy a látogató lássa, melyik nyílik. | **None** |

![A Navigation Menu Lite Extra Options szakasza a Menu Hover/Click beállítással](./kepek/karuszell-navigacio-2-nav-panel-extra.webp)

*A Navigation Menu Lite Extra Options szakasza a Menu Hover/Click beállítással* (https://minta-bolt.hu/wp-admin/post.php?post=62&action=elementor)

A képen a **Menu Hover/Click** mező látszik; mellette a **How it works** súgóhivatkozás.

## Nyitás hoverre (Hover Sub-Menu)

A hover lenyíló akkor nyílik, amikor a kurzor eléri a szülőelemet, kattintás nélkül. A legtöbb asztali látogató ezt várja egy fejléctől. Mivel ez az alapérték, általában csak megerősíted.

1. Jelöld ki a **Navigation Menu Lite** widgetet, nyisd ki a **Navigation Bar** szakaszt, a **Menu Type** maradjon **Default**, a **Select Menu** listából válaszd ki a menüt. (A **Menu Type** WordPress menü és ismétlő lista között választ, nem itt választod ki a menüt.)
2. Válassz **Menu Direction** értéket. A hover almenü a vízszintes és a függőleges képpel is működik.
3. Nyisd ki az **Extra Options** szakaszt, és a **Menu Hover/Click** értéke legyen **Hover Sub-Menu**.
4. A **Navigation Bar** szakaszban válassz **Menu Effects** stílust: a **Style 1** lecsúsztatja a panelt, a **Style 2** áttűnéssel mutatja.
5. Frissítsd az oldalt, és mutass a szülőelemre. Az almenü a kurzor alatt kinyílik, és bezárul, amikor elmozdulsz róla.

![A kinyílt Szolgáltatások almenü a kurzor alatt](./kepek/karuszell-navigacio-2-nav-hover-almenu.webp)

*A kinyílt Szolgáltatások almenü a kurzor alatt* (https://minta-bolt.hu/tp-kn2-nav/)

A képen a **Szolgáltatások** elemre mutatva megnyílt a három almenüpont.

Hogyan működik:

- A lenyíló az egér érkezésére nyílik, és az egér távozására zárul. A kurzor elhagyása után semmi nem marad nyitva.
- A **Menu Effects** csak az animációt változtatja, azt nem, hogy hover vagy kattintás nyit.
- A beállítás az egész widgetre érvényes: a menü minden szülőeleme ugyanúgy viselkedik.
- Érintőképernyőn nincs hover, ezért telefonon és táblagépen egy koppintás nyitja az almenüt, akármi van beállítva. Ha asztali gépen is ugyanezt a viselkedést szeretnéd, használd a **Click Sub-Menu** módot.

Korlátok:

- Nem lehet néhány elemet hoverre, másokat kattintásra nyitni ugyanabban a widgetben.
- A hover csak 991 px böngészőszélesség felett működik. Ez a szám fix a widgetben, és nem azonos az **Open Mobile Menu** értékével, ezért ha leviszed a töréspontot, lesz egy szélességtartomány, ahol egyáltalán nem nyílik lenyíló.
- Nincs hover-késleltetés: az almenü azonnal nyílik és zárul a kurzorral.

## Nyitás kattintásra (Click Sub-Menu)

A kattintásra nyíló lenyíló addig zárva marad, amíg a látogató nem kéri. Asztali egérrel és érintőképernyőn ugyanúgy viselkedik, és nem nyílnak az almenük, ha a kurzor véletlenül átsiklik a fejlécen.

1. Jelöld ki a **Navigation Menu Lite** widgetet, a **Navigation Bar** szakaszban a **Menu Type** maradjon **Default**, és válaszd ki a menüt a **Select Menu** listából.
2. Az **Extra Options** szakaszban állítsd a **Menu Hover/Click** értékét **Click Sub-Menu**-re.
3. A **Stílus → Main Menu** alatt állítsd a **Main Menu Indicator Style** értékét **Style 1**-re. Nyíl nélkül semmi nem jelzi a látogatónak, hogy az elemre kattintva lenyíló nyílik.
4. Frissítsd az oldalt, és kattints egy szülőelemre. Az almenü kinyílik, és nyitva marad, amíg újra rá nem kattintasz az elemre, vagy a menün kívülre nem kattintasz.

![A kattintásra kinyílt Szolgáltatások almenü](./kepek/karuszell-navigacio-2-nav-kattintas-almenu.webp)

*A kattintásra kinyílt Szolgáltatások almenü* (https://minta-bolt.hu/tp-kn2-nav-katt/)

A képen a **Szolgáltatások** elemre kattintás után nyitva marad az almenü.

Hogyan működik:

- A szülőelemre kattintva az almenü kinyílik, ugyanarra újra kattintva bezárul.
- Egy lenyíló megnyitása bezárja a menü másik nyitott lenyílóját.
- A menün kívüli kattintás bezárja a nyitott lenyílót.
- Az almenüs szülőelem soha nem követi a saját linkjét: a widget letiltja a hivatkozást, hogy a kattintás a panelt nyissa.
- A beállítás az egész widgetre érvényes, nem elemenként állítható.

Korlátok:

- Nem keverhető egy widgeten belül a kattintásra és a hoverre nyíló elem.
- A szülőelem saját oldala elérhetetlenné válik a menüből. Vedd fel az első elemként a saját almenüjébe is („Áttekintés”, „Minden szolgáltatás”), ha a látogatóknak oda is el kell jutniuk.
- A **Menu Effects** itt nem hat: a panel mindig kb. 0,4 másodperc alatt csúszik ki, akármelyik stílus van kiválasztva, így a nyitó és záró animáció nem módosítható.
- Nincs beállítás arra, hogy a lenyíló nyitva maradjon azon az oldalon, amelyre a gyermekeleme mutat.

## Hibaelhárítás

**Hover módban nem nyílik semmi.** Nézd meg, hogy az elemnek van-e gyermeke a **Megjelenés → Menük** alatt (a gyermek be van húzva a szülő alá). Ellenőrizd a böngésző szélességét is: 992 px alatt a hover szkript nem fut.

**A lenyíló széles képernyőn működik, keskeny laptopon nem.** Az Open Mobile Menu értékét 991 px alá vitted (például 768-ra), így 769 és 991 px között a vízszintes sáv látszik, de a lenyílók nem nyílnak. Hagyd az **Open Mobile Menu** értékét 991 vagy afölött.

**Az almenü bezárul, mielőtt odaérek.** A szülőelem és a lenyíló között rés van, ami megszakítja a kurzor útját. Csökkentsd az almenü felső belső vagy külső margóját a **Stílus → Sub Menu** alatt, hogy a kettő érintkezzen.

**A látogatók nem látják, mely elemeknek van lenyílója.** Állítsd a **Main Menu Indicator Style** értékét **Style 1**-re.

**Kattintásra nem történik semmi.** Az elemnek nincs gyermeke a **Menük** oldalon. A gyermek nélküli elem sima link, és úgy is viselkedik.

**A Szolgáltatások elemre kattintva a lenyíló nyílik meg a Szolgáltatások oldal helyett.** Így működik ez a mód, és a második kattintás sem navigál, hanem bezárja a panelt. Tedd a szülőoldalt külön linkként a saját almenüjébe.

**A lenyíló megnyílik, majd azonnal bezárul.** Egy másik szkript kezeli ugyanazt a kattintást. Kapcsold ki egyenként a többi menü-, felugró- vagy animációs bővítményt, és a próbák között ürítsd az oldal- és CSS-gyorsítótárat.