CSS3 Vendor-Prefixes per JavaScript erzeugen: -prefix-free
Die meisten von euch wird es sicher genauso nerven wie mich. Sobald man eine Website mit CSS3 umsetzen möchte, muss man zusätzlich zu den normalen CSS3-Befehlen die so genannten Vendor-Prefixes schreiben damit auch alle Browser die Eigenschaften interpretieren können. Das ist nicht nur lästig, häufig weiß man auch gar nicht genau welcher CSS3-Befehl welche Prefixes benötigt.
Ein kleines JavaScript namens prefixfree.js erleichtert euch die Arbeit enorm.
Responsive Webdesign!
Mein Video-Training mit über 8 Stunden Laufzeit! Programmierung, Konzeption, Gestaltung – Webdesign für alle Geräte und Auflösungen.
Jetzt bei Amazon bestellen!Prefix Free verwenden
Ladet euch das JavaScript von dieser Seite herunter und bindet es im <head> (empfohlen) eurer Seite ein. Das Script erkennt anschließend automatisch <link> oder <style>-Tags und fügt die benötigten Prefixes hinzu. Ihr müsst nur noch die normalen CSS3-Befehle schreiben.
Es existiert übrigens auch ein winziges jQuery-Plugin des Scripts.
Ein paar Ausnahmen gibt es allerdings auch:
- Per
@importeingebundene Stylesheets werden nicht berücksichtigt. - Stylesheets die nicht direkt mit der Datei verbunden sind in welcher
prefixfree.jseingebunden ist werden nicht berücksichtigt. - In einer lokalen Umgebung kann muss für Chrome und Opera die Interpretation manuell eingerichtet werden. Inline-Styles werden hingegen von Firefox und IE in lokalen Umgebungen nicht korrekt interpretiert. Mehr dazu hier.