CSS3

Eine animierte Uhr erstellen: Uhrzeit mit PHP ermitteln

Da ich mich in letzter Zeit immer häufiger mit CSS3 beschäftigt habe stieß ich neulich per Zufall auf Daniels Blog und habe die in einem Artikel beschriebene CSS-Uhr mit PHP zu einer funktionierenden Uhr weiterentwickelt. Wie auch die ursprüngliche Uhr benötigt die funktionsfähige Uhr nur HTML, CSS und PHP und arbeitet mit CSS-Animation und CSS-Transformationen.

weiterlesen

CSS und der Fluch der Präfixe

Für den modernen Webdesigner gehört es natürlich dazu, die Möglichkeiten, die einen die Webbrowser mit den brandneusten CSS-Modulen bieten, vollkommen auszureizen und zu testen. Ich nehme mich selber dabei nicht heraus. Ich probiere auch gerne die allerneusten Features aus. Und sehr gerne verwendet man diese neuen Features auch sofort in einem neuen Design, was man […]

weiterlesen

Animationen mit CSS3: Eine animierte Uhr erstellen

Nachdem wir vor wenigen Tagen die theoretischen Grundlagen für Animationen in CSS3 präsentiert haben, möchten wir heute einmal ein praktisches Beispiel für eben jene Animationen präsentieren: Eine Uhr, die zum Funktionieren keinerlei Javascript benötigt – nur ein wenig CSS und HTML reicht aus, um eine prinzipiell funktionsfähige Uhr zu erstellen. Wie dies funktioniert, möchten wir […]

weiterlesen

Animationen mit CSS3 – Teil 2: Das Animation-Modul

Lange Zeit ist es her, als der erste Teil der Miniserie über Animationen mittels CSS3 hier veröffentlicht wurde – zugegebenermaßen geriet die Serie im Laufe der Zeit ein wenig in Vergessenheit. Dennoch möchten wir heute noch einen zweiten Teil nachtragen. Nachdem wir bereits Transitionen vorgestellt haben und einen kleinen Exkurs hin zu den 2D- und […]

weiterlesen

Transformationen mit CSS3 – Teil 2 (3D)

Vor wenigen Tagen haben wir kurz in das Modul 2D-Transformationen in CSS3 geschaut, welches ja mittlerweile von allen moderneren Browsern unterstützt wird, möchten wir heute ein darauf aufbauendes weiteres CSS3-Modul blicken, welches noch ein wenig neuer und auch etwas komplizierter bzw. umfangreicher ist: Transformationen in der 3. Dimension. War es bisher nur möglich, die HTML-Elemente […]

weiterlesen

Transformationen mit CSS3 – Teil 1 (2D)

Nachdem wir vor wenigen Tagen Animationen mit CSS3 via transition vorgestellt haben, wollen wir dieses Mal noch eine Grundlage für weitere nette Möglichkeiten der Animation mit CSS3 legen und damit ein weiteres experimentelles CSS3-Modul vorstellen: 2D-Transformationen (siehe Link für die genaue Spezifikation vom W3C). Da es neben den 2D-Transformationen auch noch 3D-Transformationen gibt, die noch […]

weiterlesen

Animationen mit CSS3 – Teil 1: Transitions

Zwar befindet sich CSS3 auch nach über 10 Jahren der Entwicklung noch immer in keinem fertigen, stabilen Zustand, dennoch veröffentlichten bekanntlich die Browserhersteller einige Neuerungen schon vorab – ein paar vereinzelte davon sind schon als stabil eingestuft (beispielsweise die Text-Schatten). Viel interessanter sind jedoch zumeist die Features, die die Browser-Hersteller erst als experimentell eingestuft haben, […]

weiterlesen