senäh

17senäh und so…

Media Query Variablen

HTML/CSS/JS
03. Mai 2012
Kommentare: 3

Angewandte Media-Queries mit JavaScript auslesen – ohne Breakpoint-Doppelung

Kategorien: HTML/CSS/JS | 03. Mai 2012 | Kommentare: 3

Ich bin über einen interessanten Artikel zum Thema Navigation in Responsive Designs gestoßen, der mögliche Variationen der Navigation aufzeigt, sobald der Bildschirm des Endgeräts schmaler wird. Was dabei angesprochen wurde: statt der eigentlichen Navigationsleiste am oberen Ende der Seite findet man ein Dropdown-Menü, das alle nötigen Navgationspunkte beinhaltet. Mittlerweile gar nicht so unüblich.

Dazu bedarf es jedoch ein wenig JavaScript. Die Listenpunkte müssen ja irgendwie in ein Dropdown-Menü umgewandelt werden. Nun hat man im CSS schon mühsam seine Breakpoints gesetzt, an denen sich das Layout jeweils anpasst. Müssen wir diese jetzt im JavaScript erneut formulieren? Dopplungen soll man doch immer vermeiden. Was ist wenn wir die Breakpoints ändern wollen? Wir müssten stets 2 verschiedene Stellen – sowohl im CSS als auch im JavaScript – pflegen. Kann das die Lösung sein? Weiterlesen →