Tooltips ohne JavaScript

Möchte man zu einem In der Regel handelt es sich bei den Elementen um LinksElement noch zusätzliche Informationen darstellen, wenn der Besucher über dieses mit der Mouse fährt, eignen sich Wie dieser hierTooltips.

Wie solche Tooltips ganz ohne JavaScript realisiert werden, wird in folgendem Tutorial beschrieben.

(weiterlesen …)

Farbverläufe mit CSS3

Heute erkläre ich die Erstellung von Farbverläufen mit CSS3.

(weiterlesen …)

Empfehlung: SASS/Compass

Ein Werkzeug, das ich mittlerweile nicht mehr missen will, ist Compass.

Damit lässt es sich um ein vielfaches leichter mit CSS arbeiten! Man kann Variablen und Funktionen festlegen, die man dann den Elementen, Klassen und IDs zuweist und sich somit einiges an Zeit einsparen.
(weiterlesen …)

<audio> – Sounds einbinden

Früher mussten wir für Audio-Ausgaben Plugins wie z.B. den Flashplayer verwenden. Mittlerweile können das die aktuellen Browser von Haus aus.

Das fantastische dabei: Die API für <audio> bietet viele Möglichkeiten per JavaScript auf das Sound-Stück zuzugreifen.

Hinweis: Diese Demo funktioniert derzeit nur in Chrome fehlerfrei.

(weiterlesen …)

CSS3 Animations

Mit Animations ist es möglich, Elemente im komplexeren Maß zu animieren.

Fahre mit der Mouse über mich um die Animation anzuhalten

Eines vorweg: Zum Zeitpunkt des Schreibens dieses Artikels, funktioniert es nur in Chrome, Firefox und Safari.
(weiterlesen …)

CSS3 2D Transforms – Elemente rotieren, skalieren und mehr

Dank Transitions ists es möglich, Elemente (mit allen Kind-Elementen) zu rotieren, skalieren, verschieben oder verzerren.

Ich bin um 45° gedreht.

(weiterlesen …)

CSS3-Transitions

Mit CSS3 haben wir viele neue Werkzeuge bekommen, die es uns ermöglichen, wirklich schicke Effekte zu erzielen.

Mit Transitions können Überblend-Effekte definiert werden, die ausgeführt werden, wenn ein Element seinen Status ändert. zB. durch MouseOver oder Zuweisung einer neuen Klasse (wie z.B. mit $('#myElement').addClass('myNewClass');).

Fahre mit der Mouse über mich

(weiterlesen …)

Chrome Frame – Die WebKit Engine im Internet Explorer verwenden

Dass der Internet-Explorer, vor allem die älteren Versionen, vielen Webentwicklern Probleme bereiten, ist kein großes Geheimnis.

Um auch den Usern ein gutes Surf-Erlebnis zu ermöglichen, denen es nicht möglich ist den Browser zu wechseln (z.B. bei größeren Firmen), hat Google ein Plugin für den IE veröffentlicht (weiterlesen …)

Checkboxen mal anders

Mit diesem kleinen Trick ist es möglich, das Aussehen von <input type="checkbox"> ein wenig anders zu gestalten:

(weiterlesen …)

Ausgabe für kleinere Monitore optimieren

Optimierte Darstellungen für Anzeigegeräte wie Smartphones oder Tablets werden immer wichtiger.

Für diese Aufgabe einen sich CSS3 Media-Queries.

Damit kann man die Darstellung von Elementen anpassen, wenn das Anzeigegerät eine gewisse Breite unterschreitet.

Wenn du die Breite deines Browsers änderst, siehst du, was ich meine ;)
(weiterlesen …)

« Ältere Einträge