JavaScript Events für Responsive Webdesign

Responsive Webdesign ist nicht nur begrenzt auf geschicktes HTML & CSS sondern hat auch Auswirkungen auf JavaScript. Zum einen möchte man, dass bei einer geringeren Auflösung sich ein Element eventuell anders verhält als bei einer höheren, und meistens möchte man auch verschiedene Funktionalitäten hinsichtlich der verschiedenen Auflösungen. Wäre super wenn es entsprechende Events gäbe, die bei einem Switch der Auflösung gefeuert werden, gibt es aber nicht.

Screenshot von Breakpoint.js

Mit Breakpoint.js erhält man in Vanilla JavaScript eine kleine Library, die für entsprechende Events sorgt. Logischerweise nimmt das Skript die Breite des Displays als Basis, für die dann frei Events eingerichtet werden können (also nicht nur für die gängigen Breiten, sondern für jede beliebige). Entsprechend gibt es für jede dieser Breiten zwei Events: nämlich einmal dafür, dass die Grenze unterschritten wird, und einmal dafür, dass die Grenze überschritten wird.

Jedes dieser Events lässt sich an eine Function binden. Das Projekt wird bei GitHub gehostet, und ist natürlich etwas, das man auch selbst machen könnte. Aber gerade bei solchen Sachen macht eine zentrale Verwaltung durchaus mehr Sinn, um alle Eventualitäten aller Browser durch die Community abfangen zu lassen.

Ähnliche Beiträge

Einfach mal eine Ansi-Grafik auf die Homepage pack... Früher, als alles noch besser war, und ich mich in Mailboxen herumgetrieben habe, gabs immer coole Ansi-Intros. Am Anfang waren es nur einfache Schrif...
JavaScript & Canvas anstatt Visio Das Canvas-Element kann schön zeichnen und die Entwicklung geht klar vom Desktop weg hin zur Cloud, was dann fehlt sind die entsprechenden Lösungen. N...
Tutorial Google Maps API – die Anfänge mit JavaScr... Wie versprochen kommt heute der erste Teil des Google Maps Tutorials, dass sich primär mit der API an sich und JavaScript beschäftigen wird. Bevor wir...
TaffyDB – Datenbank für JavaScript In vielen Fällen läuft es heutzutage so, das Daten in Tabellen zum Beispiel nicht mehr direkt eingesetzt, sondern mittels AJAX nachgeladen werden. Ger...

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.