Durch die CSS-Angaben max-width und max-height können Größenangaben von HTML-Elementen verändert werden. Um die veränderte Größe abzufragen, können dann die Eigenschaften clientWidth und clientHeight verwendet werden.
Das folgende Beispiel veranschaulicht den Sachverhalt.
Veränderte Größenangaben mit JavaScript ermitteln weiterlesen
This is just a basic code snippet which shows how you can handle Drag & Drop interactions with a web browser and HTML5. If you select multiple images and drag them into the drop target, then the file names of the dropped images will be logged.
Drag & Drop of Images with HTML5 weiterlesen
The following example shows how the types of functions and objects can be used to detect the capability of a web browser. The example shows the detection of the WebRTC functionality in a standard way and then uses the ternary operator and the behaviour of truthy and falsy values to refactor the code. The business logic is written in a self-executing function.
Best practice: Truthy and falsy values in JavaScript weiterlesen
Es gibt verschiedene Möglichkeiten, um eine Art „Namespaces“ in JavaScript zu definieren. Mir gefällt dabei folgender Ansatz, der es ermöglicht, Module innerhalb eines gemeinsamen Namensraums zu definieren:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | window.wlc = window.wlc || {}; // Namespace wlc.DocumentHandler = (function() { // Module function DocumentHandler() { this.originalTitle = 'Hello World!'; } DocumentHandler.prototype.alertTitle = function() { alert(this.originalTitle); }; return DocumentHandler; })(); var documentHandler = new wlc.DocumentHandler(); documentHandler.alertTitle(); |
Knockout.js unterstützt das MVVM-Entwurfsmuster von Microsoft und lässt sich sehr gut für das Templating in HTML5-Webprojekten nutzen. Über das data-Attribut lassen sich View-Elemente an ein ViewModel binden, welches die Anzeige dann mit entsprechenden Daten befüllt. Es folgt ein Beispiel für den Einsatz von Knockout.js zum Befüllen von Listen.
Templating mit Knockout.js weiterlesen
Momentan arbeite ich gerade zusammen mit simpleTechs an einem Webprojekt, bei welchem JavaScript eine starke Rolle spielt. Da ich bei diesem Projekt mit dem Bau einer Hilfsklasse für diverse JavaScript-Funktionen beschäftigt bin, habe ich nochmal über Entwurfsmuster (engl. design patterns) für JavaScript-Objekte nachgedacht.
Für den Entwurf von Objekten, die eine Abhängigkeit zu anderen Objekten (bspw. jQuery) haben, gefällt mir dieses Design besonders gut:
Entwurfstmuster für JavaScript-Objekte mit Abhängigkeiten weiterlesen