Navigation sideways in Mobile

  • Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Tonald Drump

Neues Mitglied
13 Januar 2017
28
1
1
72
#1
Guten Tag,

Ich suche mal wieder einen Nudge und wurde bis jetzt hier noch nie enttäuscht. Es dreht sich um folgendes:

Xerox - Homepage

Wenn man sich die Homepage, genauer genommen die Navigation, von Xerox ansieht, versteht man mich vielleicht ein bisschen besser. Ich finde diese Navigation absolut großartig und gelungen. Was ich am meisten daran liebe, ist wie sie in der mobilen Ansicht verschachtelt ist. Diese Menü-Weiterführung durch ein von rechts ersetzendes Fenster.. Ja.. ich glaube man merkt, was mein Problem ist. Ich weiß nicht, wie man so etwas nennt, würde es aber sehr gerne selber in meinem Umfang bauen.

Gibt es für so etwas ein Template von Bootstrap oder wie nennt an so etwas? Ich selbst wüsste nicht einmal wie die Funktion für so ein Vorgehen heißt. Deswegen könnte ich es gar nicht selbst schreiben. Ich fände es großartig, wenn mir da jemand ein-zwei Schlagwörter geben könnte, damit ich das auch lernen kann.

Mit freundlichem Gruß,
 

scbawik

Senior HTML'ler
14 Juli 2011
2.494
437
83
#2
Guten Tag,

Ich suche mal wieder einen Nudge und wurde bis jetzt hier noch nie enttäuscht. Es dreht sich um folgendes:

Xerox - Homepage

Wenn man sich die Homepage, genauer genommen die Navigation, von Xerox ansieht, versteht man mich vielleicht ein bisschen besser. Ich finde diese Navigation absolut großartig und gelungen. Was ich am meisten daran liebe, ist wie sie in der mobilen Ansicht verschachtelt ist. Diese Menü-Weiterführung durch ein von rechts ersetzendes Fenster.. Ja.. ich glaube man merkt, was mein Problem ist. Ich weiß nicht, wie man so etwas nennt, würde es aber sehr gerne selber in meinem Umfang bauen.

Gibt es für so etwas ein Template von Bootstrap oder wie nennt an so etwas? Ich selbst wüsste nicht einmal wie die Funktion für so ein Vorgehen heißt. Deswegen könnte ich es gar nicht selbst schreiben. Ich fände es großartig, wenn mir da jemand ein-zwei Schlagwörter geben könnte, damit ich das auch lernen kann.

Mit freundlichem Gruß,
Keine Ahnung wie man so etwas nennt, vielleicht Multi-Level Push Menu?
https://tympanus.net/codrops/2013/08/13/multi-level-push-menu/
 
Zustimmungen: Tonald Drump

Tonald Drump

Neues Mitglied
13 Januar 2017
28
1
1
72
#3
Das ist schon ziemlich geil. Vielen Dank.

EDIT:

Ich bin viel zu schlecht für responsive Navigationen. Ich krieg das null gebacken und es frustriert mich zutiefst. Wie bekommt man sowas hin. Ich will ab ner 600 Pixel Breite ein MegaMenu und darunter so ein multi-level-push Kram. Mich macht das echt fertig.

Habe sogar exakt gefunden was ich suche.. Also in der Mobilen Version: Das Hier . Nur sieht da die Desktop version halt net so aus.
 
Zuletzt bearbeitet:

Sempervivum

Senior HTML'ler
18 Oktober 2016
1.204
254
83
65
#4
Ich habe mir mal die Mühe gemacht, das aus deinem letzten Link in der Desktop-Ansicht auf eine horizontale Anordnung umzustellen. Sieht dann so aus:
dropdown.png
CSS:
@media only screen and (min-width:1024px) {
    ul.cd-dropdown-content {
        display: flex;
        width: auto;
    }
    .cd-dropdown-content .cd-divider {
        display: none;
    }
    li.has-children {
        position: relative;
    }
    ul.cd-dropdown-content > li.has-children > ul {
        left: 0;
        top: 100%;
    }
    ul.cd-dropdown-content > li.has-children > a::before,
    ul.cd-dropdown-content > li.has-children > a::after {
        display: none;
    }
    .cd-dropdown-wrapper > .cd-dropdown {
        opacity: 1;
        visibility: visible;
    }
    .cd-dropdown-trigger {
        display: none;
    }
}