<details open="open"> mit Media Queries an- und ausschalten
Bimmelbeule
<details open="open"> mit Media Queries an- und ausschalten
Bimmelbeule
Gunnar Bittersmann
Rolf BHallo!
Auf dieser Website habe ich die Navigation mit details gelöst.
Auf dem Smartphone finde ich es sinnvoll, das immer nur die drei details-Themenbereiche oben angezeigt werden, wenn man eine Seite aufruft, weil man dann den Anfang des aufgerufenen Artikel sieht ohne scrollen zu müssen.
Auf dem Desktop rutscht die Navigation nach links und da möchte ich das der jeweilige details-Themenbereich offen bleiben. Das kann ich mit <details open="open"> in der HTML-Datei erreichen.
Frage: Ist es möglich nur mit HTML/CSS open="open" per Media Queries an- und auszuschalten? Wenn ja, kann mich mal bitte jemand in die richtige Richtung schubsen?
Grüße, Horst
-
@@Bimmelbeule
Auf dieser Website habe ich die Navigation mit details gelöst.
Dass dies keine so gute Idee ist, hatten wir desöfteren schon thematisiert.
Frage: Ist es möglich nur mit HTML/CSS open="open" per Media Queries an- und auszuschalten?
Die
open-Eigenschaft desdetails-Elementobjekts ist im DOM verankert. Die kannst du mit CSS nicht ändern.🖖 Живіть довго і процвітайте
--
„Im Vergleich mit Elon Musk bei Twitter ist ein Elefant im Porzellanladen eine Ballerina.“
— @Grantscheam auf Twitter-
Auf dieser Website habe ich die Navigation mit details gelöst.
Das dies keine so gute Idee ist, hatten wir desöfteren schon thematisiert.
Ja… aber es scheint mir als Javascript-Phobiker die beste Möglichkeit zu sein meine Navigation rudimentär responsive zu realisieren… oder hat da noch jemand eine Idee?
Frage: Ist es möglich nur mit HTML/CSS open="open" per Media Queries an- und auszuschalten?
Die
open-Eigenschaft desdetails-Elementobjekts ist im DOM verankert. Die kannst du mit CSS nicht ändern.[seufz]
Das hatte ich befürchtet…Danke für die schnelle Antwort!
🖖 Живіть довго і процвітайте
-
@@Bimmelbeule
Ja… aber es scheint mir als Javascript-Phobiker die beste Möglichkeit zu sein meine Navigation rudimentär responsive zu realisieren…
Deine JavaScript-Phobie interessiert Nutzer nicht.
Die Bedienbarkeit einer Navigation mit
detailsin Screenreader o.a. assitiven Technologien ist so meh.oder hat da noch jemand eine Idee?
Diese Idee (nur eine Ebene tiefer in der Hierarchie) wäre ein Anfang – aber wohl nicht das Ende. An der Bedienung per Tastatur wäre noch zu schrauben: entweder geht das Menü beim Verlassen zu oder es wird so umgesetzt, dass man es nicht mit Tab-Taste verlassen kann (focus trap).
🖖 Живіть довго і процвітайте
--
„Im Vergleich mit Elon Musk bei Twitter ist ein Elefant im Porzellanladen eine Ballerina.“
— @Grantscheam auf Twitter -
Hallo Bimmelbeule,
Javascript-Phobiker
Tja. Mit JavaScript könntest Du eine Medienabfrage machen und damit die open-Eigenschaft vorbelegen.
Rolf
--
sumpsi - posui - obstruxi
-
-