Archiv

App mit HTML5 und CSS3 umsetzen

Eine Möglichkeit ohne native Programmierung eine App in die Tat umzusetzen. Ein Beispiel ist das Magazin aside. Advertisements

Weiterlesen

CSS3 Trick – rgba() : PNG Bilder

Unterstützt ein Browser das Kommando rgba() nicht, sollten transparente PNG-Bilder eingesetzt werden. Browser die rgba() unterstützen sollen jedoch nicht die PNG-Bilder laden. If Anweisung quasi für Browser sind conditional Comments, konditionale Kommentare. NT #1: nur ein Mittel um verschiedene Versionen des IE anzusprechen NT #2: oder um alle Browser außer dem IE zu erreichen NT […]

Weiterlesen

CSS3 Trick – Box Schatten und Modernizr

Beispiel zum Einsatz vom Modernizr Artikel, Umsetzung der Klassen. HTML <div id=“test“>Medieninformatik Rocks!</div> CSS .boxshadow #test { -moz-box-shadow: 0 3px 10px rgba(0,0,0,0.5); -webkit-box-shadow: 0 3px 10px rgba(0,0,0,0.5); box-shadow: 0 2px 5px rgba(0,0,0,0.5); border-width: 0; } #text { /* modernizr hin oder her, diese Formatierung geht immer */ border-right: 1px solid #000; border-bottom: 2px solid #000; […]

Weiterlesen

#3 CSS3 Wissen woran man ist mit Modernizr

Der Modernizr hilft dabei zu wissen wie weit der Browser ein CSS3 Feature unterstützt. Modernizr ist ein JavaScript, das die CSS3- und HTML5-Elemente testen kann. Auf deren Website einfach alle Checkboxen zu CSS3 und HTML5 anklicken, die JavaScript-Datei erzeugen lassen und downloaden. Dann heißts einbinden in seine Website: <script src=“js/modernizr-css3-html5.js“ type=“text/javascript“></script> Modernizr fügt damit einige […]

Weiterlesen

#2 CSS3 Vorteile

Grafiken können durch CSS3 Eigenschaften realisiert werden. Das spart Speicherplatz und Zeit von Photoshop oder Illustrator. Bilder und Effekte werden durch Code umgesetzt. Das Warten der Website ist etwas leichter. Weniger Bilder bedeutet weniger HTTP Anfragen. Performance Vorteil! Effekte und Animationen gehen auch ohne JavaScripte. Media Queries Mit Media Queries können zu verschiedenen Endgeräten passende […]

Weiterlesen

#1 CSS3 Browser Präfixe

Hersteller Präfix und Browser -moz-      Gecko Browser wie Mozilla Firefox -o-            Opera -webkit-  Safari, Google Chrome, Apple -kthml-    Konqueror -ms-         Internet Explorer, Microsoft Eine vollständige Liste gibts natürlich beim W3C. Die Präfixe existieren da CSS3 immer weiter entwickelt wird und die Browser-Entwickler viele Eigenschaften testweise implementieren. -moz-transform wird […]

Weiterlesen

jQuery Plugin turn.js Blätter-Effekt für Bücherseiten

Flip-Book-Effect durch das jQuery Plugin turn.js. Kleine Einführung von t3n. Will man die Software kommerziell benutzen, muss eine Lizenz gekauft werden von turnjs. Die Version 3 kann für eigene Zwecke benutzt werden. Zur Github Seite mit den Funktionen gehts hier entlang.

Weiterlesen