Horizontales Menü fixieren?

Mehr
4 Wochen 13 Stunden her #3712 von Andre
Andre erstellte das Thema Horizontales Menü fixieren?
Hallo Leute, ich schon wieder mit ner Design-Idee....

Kann man mit einem "Custom CSS-Code" im Template eigentlich die horizontale Menüleiste fixieren, so dass sie beim scrollen am oberen Bildschirmrand "kleben" bleibt?

Gruß
André

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Mehr
4 Wochen 8 Stunden her #3713 von Thomas Hunziker
Thomas Hunziker antwortete auf das Thema: Horizontales Menü fixieren?
Geht sicher irgendwie, hab ich aber noch nie versucht :)
Du brauchst denke ich sicher auch JavaScript dafür. Beim schnellen Googlen habe ich zB das gefunden: codepen.io/senff/pen/ayGvD

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Mehr
4 Wochen 7 Stunden her #3714 von Andre
Andre antwortete auf das Thema: Horizontales Menü fixieren?
Ja, das wäre ne Möglichkeit. Ich dachte, dass man, so wie mit dem #beforehead machen kann.

#beforehead{
position: fixed;
top: 0;
z-index: 1;
}

Nur das man das mit dem Menü auch machen kann. Ist mir nur nicht gelungen. Jetzt hatte ich die Hoffnung einfach was übersehen zu haben.

Gruß
André

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Mehr
4 Wochen 1 Stunde her #3715 von Matthias
Matthias antwortete auf das Thema: Horizontales Menü fixieren?
Da hier Desktop und mobile Ansicht recht verschieden sind, lohnt es sich Media-Queries zu nutzen.
Das wären
/* Code für mobil + Desktop */
@media (max-width: @navbarCollapseWidth) {
    /* Code für mobiler */
}
@media (min-width: @navbarCollapseDesktopWidth) {
    /* Code für Desktop */
}
Durch die Verwendung der LESS-Variablen skaliert der Code mit der im Backend genutzten Option.

Für die mobile Variante bietet sich #topmenu_container, für die Desktopvariante #topmenu an.
Der Rest ist dann nur noch ne Design-Frage.

@Thomas: Der von dir verlinkte Code sieht ja recht simpel aus. Wäre das was fürs Template? (Ich würde das dann über Klassen regeln: sticky, sticky-mobile, sticky-desktop. So kann man selbst entscheiden, ob man das möchte.)
Ne Option für ne frei einbindbare JS wäre wahrscheinlich auch nicht schlecht.

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Mehr
3 Wochen 6 Tage her #3716 von Thomas Hunziker
Thomas Hunziker antwortete auf das Thema: Horizontales Menü fixieren?
@Matthias Ich hab das nur ergoogelt. Ich hab keine Ahnung ob es mit dem Allrounder funktioniert :)
Ein eigene JS kann man ja sehr einfach enbinden mittels entsprechenden Modulen oder Plugins. Oder man macht nen Override für das Menümodul-Layout, wo man dann ja auch JS einbinden kann. Ich denke nicht dass wir diese Option im Template benötigen.
Wenn es auf einfachem Weg möglich ist son Sticky Menü im Template aufzunehmen merge ich das gerne. Es gibt aber vermutlich auch schon entsprechende Menümodule im JED welche das templateunabhängig machen.

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Mehr
3 Wochen 5 Tage her - 3 Wochen 5 Tage her #3717 von Andre
Andre antwortete auf das Thema: Horizontales Menü fixieren?
Erst mal Danke, dass ihr euch damit beschäftigt. Aus vielen Ideen und Überlegungen entsteht evtl. das, was man sucht...

Was z.B. geht ist:

#topmenu ul.menu {
position: fixed;
top: 0;
z-index: 1;
}

Dann klebt das aber ständig am oberen Rand. Ich hätte eben gern, dass es an der Position steht, an der es definiert ist, und erst am oberen Rand hängen bleibt, wenn die Seite nach oben scrollt.

Ideen?
Gruß
André

Ach ja, noch was: @Thomas: Kann ich das Hintergrundbild in "Template Colors" -> 'Background Image" auch fixieren?
Letzte Änderung: 3 Wochen 5 Tage her von Andre.

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Ladezeit der Seite: 0.087 Sekunden
Powered by Kunena Forum
   
© Bakual