intention.js: Media Queries für einzelne Elemente
Kommentare

Den Dow Jones kennt man in erster Linie für seinen Aktienindex an der Wall Street. Doch bei dem Verlagshaus arbeiten auch Webentwickler. Und die haben jetzt sehr praktische JavaScript-Bibliotheken auf

Den Dow Jones kennt man in erster Linie für seinen Aktienindex an der Wall Street. Doch bei dem Verlagshaus arbeiten auch Webentwickler. Und die haben jetzt sehr praktische JavaScript-Bibliotheken auf GitHub veröffentlicht. Das dynamische Duo aus intention.js und context.js ist eine alternative Heranghensweise an Responsive Webdesign. Die Bibliotheken werten die bisher oft recht unbedarfte Verwendung von Media Queries auf um die Möglichkeit, jedes HTML-Element einzeln an bestimmte Gerätegrößen anzupassen. Und dazu gehört noch viel mehr.

Intention und Context lösen Events aus, die HTML-Elemente mit bestimmten Klassen versehen und somit Werbung neu anordnen und der Größe anpassen, Slideshows durch Touch-optimierte Alternativen ersetzen oder Retina-Display-optimierte Bilder laden. Dem Entwickler bleiben dabei etliche Freiräume; etwa welche Schwellenwerte er für die Viewports ansetzt, oder was beim Drehen des Gerätes geschehen soll.

Die HTML-Elemente werden dafür einzeln mit intents versehen, die während des Betrachtens auf Clientseite dynamisch durch die vordefinierten CSS-Klassen ersetzt werden und dadurch das Element entsprechend anpassen. Der Media-Query-Rahmen wird von intention.js gesprengt, was am Beispiel eines durch Scrollen ausgelösten Events vorgeführt wird. Es ist also auch beliebig, wann intention.js seine Events emittieren soll.

Dow Jones hat intention.js auf GitHub unter MIT-Lizenz zur Verfügung gestellt. Auf der Homepage könnt Ihr Euch das Projekt in Aktion ansehen.

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -