Blog

Dlouhé sticky menu na mobilu

Kvě 9, 2022

Při použití sticky menu (menu, které při scrolování stránky zůstane nalepené nahoře a je tedy vždy viditelné) se někdy může stát, že menu zakryje celý obsah webu, pokud je hodně košaté.
Bohužel – DIVI nemá v základu pro tuto situaci řešení.
Bohudík – řešení je na pár řádků CSS.

Na obrázku je vidět, jak menu zakrylo celý text webu. Největší problém ale je, že se nejde posunout na stránce dolů, protože je menu přilepené na stránce a není vidět žádná plocha, která by se dala posouvat.

Sticky menu problem

V podstatě stačí vložit do globálního CSS (Appearance -> Customize -> CSS) následujících pár řádek:

.et_mobile_menu {   
    overflow-y: scroll !important; /* limit the menu area and show the scroll sidebar */
    max-height: 80vh !important; /* set height of the menu to see rest of the page */
    -overflow-scrolling: touch !important;
    -webkit-overflow-scrolling: touch! important;
}

A to je celé, víc není potřeba. Menu si můžete udělat jakkoli vysoké tím, že upravíte jeho výšku.

Sticky menu řešení

Ideálnější řešení by bylo udělat položky menu rozbalovací, ale to tom někdy jindy.

Zdroje:

Co si ještě přečíst?

Zajímavosti z projektů

Jak změnit wp-login URL

Občas je zajímavé podívat se, kdo na Váš web chodí a hlavně - kam. Např. pluginy jako Wordfence a...

Bezvýpadkové nasazení webu

O co vlastně jde Ne vždy má člověk štěstí na to, aby dělal nový web od základu a občas je potřeba...

Práce s DIVI

Lokální fonty v DIVI

DIVI má k dispozici velký výběr fontů, hlavně Google Fonts (i když některé chybí) a další. V tom...

Mega menu bez pluginu

Poslední dobou čím dál častěji potkávám tzv. "Mega-menu", tedy podmenu, které je přes celou šířku...

Návody

Jak změnit wp-login URL

Občas je zajímavé podívat se, kdo na Váš web chodí a hlavně - kam. Např. pluginy jako Wordfence a...

Lokální fonty v DIVI

DIVI má k dispozici velký výběr fontů, hlavně Google Fonts (i když některé chybí) a další. V tom...

Mixed content na webu

Mixed content na webu dokáže pěkně potrápit. V lepším případě se zobrazí jako otravná hláška v...