Wie in der Überschrift schon beschrieben, brauche ich von
jemandem von euch eine Hilfestellung beim modifizieren eines
ausklappbaren Seitenmenüs mit Hamburger-Button.
Es ist eine Version mit JS und bietet mit den passenden "ARIA
attributes" ansich eine "full accessibility", wobei auch die
Skip - TAB-Funktion (Skip - Links) berücksichtigt wurde.
Zur Ansicht des JS:
"Link gelöscht"
Mein body besteht aus drei grids nebeneinander:
body {
display: grid;
grid-template-columns: [left] minmax(0.45em,1fr) [main] minmax(10em,70em) [right] minmax(0.45em,17rem);
grid-template-rows: 1;
grid-gap: 0;
}
Im rechten grid möchte ich die Haupt-Navi haben.
Es gibt drei "Zustände" die die navi haben kann.
a) Die Navigationspunkte werden alle voll angezeigt. Soweit habe ich es schon.
Nur was jetzt noch fehlt ist das meine SUBNAV "<div class="subnav" hidden>" welche momentan noch darunter angezeigt werden, was ich nicht möchte, seitlich von rechts langsam einslidert und zwar dann auch rechts von den Hauptmenüpunkten. Dort stehenbleibt.
--
b) zweiter "Zustand" wenn das Browserfenster zusammengezogen wurde und der Hamburger Button erscheint.
Auch hier soll das SUBMENUE mit seinen Unterpunkten seitlich von rechts langsam einslidern und zwar dann auch rechts vom Hamburger-Button.
--
c) dritter Zustand: bei allem was kleiner als 43.75em ist ( @media (min-width: 43.75em) {} )
Bei diesem Fall sollen alle Menüpunkte untereinander dargestellt werden und am liebsten sollte dann die Untermenü-Punkte mit details und summary geöffnet und geschlossen werden. Was sich ja auch mit der ul und li Struktur anbietet.
--
Um das alles zu bewerkstelligen brauche ich eure Hilfe.
Ich brauche jemanden der mir das Schritt für Schritt zeigt und anleitet wie es geht.
Auch wenn ich keine große Routine darin habe möchte ich alles nur gezeigt bekommen oder aber auch Hinweislinks dazu bekommen.
Keine sofortige Komplettlösung.
--
Hier nun der Link zu meinem aktuellen Beispiel zum ansehen, es wird eine Site für einen guten Kumpel von mir:
"Link gelöscht"
Freue mich über eure aktive Hilfe.
M.
