Modernizr

Modernizr ist eine kleine JavaScript Bibliothek, die die Verfügbarkeit von modernen JavaScript Technologien prüft z. B. Funktionen, die in HTML5 und CSS3 zur Verfügung stehen. In den modernen Browsern sind viele dieser neuen Funktionen bereits implementiert, in älteren leider nicht. Modernizr erstellt ein JavaScript Objekt, über das diese Informationen abgerufen werden können.

Außerdem stellt die Bibliothek ein Mechanismus bereit, über den weitere Bibliotheken geladen werden können.

Installation

Nach dem Download muß im <head>-Bereich der Seite die Javscript-Datei eingebunden werden:

<script type="text/javascript" src="modernizr.js" />

Auf der Homepage von Modernizr kann der Funktionsumfang individualisiert werden:

Download individualisieren auf modernizr.com

Download individualisieren auf modernizr.com

Verwenden

Die Verwendung des Objects ist simple:

<script type="text/javascript">
  console.log(Modernizr); // gesamtes Object ausgeben
  // Abfragen ob, border-radius unterstützt ist
  if(Modernizr.borderradius) {
      // ...
  }
  // ...
</script>

Nachfolgend ein Auszug aus dem Modernizr Objekt:

Modernizr Javascript Object

Modernizr Javascript Object im Firefox

Ebenfalls eine nützliches Werkzeug ist der Skript-Loader:

Modernizr.load({ 
    // Testbedingung: Steht Geo-Lokalisierung zur Verfügung?
    test: Modernizr.geolocation, 
    yep : 'geo.js', // Ja, lade geo.js
    nope: 'geo-polyfill.js' // Nein, lade alternative Implementierung
  }
);

Eine gute Dokumentation findet sich auf der Homepage des Projekts.

Kommentar verfassen