Monatsarchiv: März 2014

Responsive Processing js

Um einen Processing js Sketch auch im Sinne von Responsive Webdesign nutzen zu können, eignet sich am besten der Einsatz von jQuery. Hierzu sind nur wenige Anpassungen im HTML-Code und im Processing-Sketch nötig. Zum einen muss dieser um eine Methode zur Größenveränderung (resizeSketch()) erweitert werden, der die jQuery-Methoden width() und height() nutzt, zum anderen wird im HTML-Dokument mit resize() ein event handler eingebaut, der resizeSketch() bei einer Veränderung der Größe des genutzten canvas-Elements aufruft.

CSS Media Query Test v2.0

Dies ist die Online-Version meines CSS Media Query Tests, mit dem das Feedback des Browsers getestet werden kann. Der genutzte CSS-Code ist unter http://qk-online.de/chartmann/files/2014/03/cssMediaQueryTest.css zu finden. Die erste Version entstand bei der Realisierung der Projektarbeit Burogutema – Responsive WordPress Theme im Wintersemester 2012/2013. Diese habe ich nun noch einmal überarbeitet, so dass die Werte nun auf den Pixel genau angegeben werden. Bei Änderung der Fenstergröße oder der Orientierung bei Smartphones und Tablets werden die Werte automatisch aktualisiert.