CSS Image Rollover - Final Words

31. October 2007

In zwei Tutorials hatte ich bereits vorgestellt, wie sich Rollover, also Grafik-Links, die sich beim überfahren mit der Maus ändern, am besten per CSS gestalten lassen.
In diesem Tutorial will ich noch einen letzten Schritt weiter gehen, und eine Kleinigkeit einfügen, die bei den vorgestellten Lösungen noch fehlte: der Linktext. In den vorherigen Tutorials und Besipielen [...]

Design in verschiedenen Browsern testen

8. February 2007

Einige Tools für alle, die keinen Fuhrpark von Macs, Windows- und Linux-PCs ihr eigen nennen und trotzdem ihr Design schnell für Internet Explorer 5, 6, 7, Firefox, Safari, Konqueror und Opera testen möchten:
Browsershots.org
Erstellt mehr oder weniger schnell (zwischen 10 Min. und 4 Stunden) Screenshots auf einer Vielzahl von Plattform-Browser-Kombi.
http://browsershots.org
Multiple IE
Tredosoft.com stellt diesen netten Installer zur [...]

Div an Float-Höhe anpassen

1. February 2007

Häufig wird die CSS-Eigenschaft float benutzt, um DIVs innerhalb von anderen DIVs nebeneinander anzuordnen. Eine DIV, die ja ein Block-Level-Element ist, erzwingt eigentlich einen Zeilenumbruch. Durch float:left; lässt sich dies verhindern, mehrere DIVs lassen sich so horizontal anordnen. Dies lässt sich ausnutzen, um mehrspaltige Layouts ohne TABLE zu erstellen.
So weit alles kalter Kaffee.
Häufig stehen diese [...]

CSS Image Rollover - Revisited

22. November 2006

Im letzten Artikel hatte ich beschrieben, wie sich durch Kombinieren von mehreren Rollover-Grafiken in eine Datei erstens Dateigröße und zweitens Reaktionszeit des Rollovers verringern lassen. In diesem Artikel möchte ich diese Taktik auf die Spitze treiben. Wir werden drei Rollover in einer Datei kombinieren und so die Dateigröße weiter drücken - das ganze natürlich Standardkompatibel [...]

CSS Image Rollover - Best practice

22. September 2006

Zum Einstieg in mein neues Blog, in dem ich XHTML- und CSS-Tutorials schreiben werde, möchte ich einen Überblick über den neusten Stand beim Thema Image Rollover geben.
Sicherlich sind jedem noch die 50 Zeilen Javascript-Code bekannt, die Adobe ImageReady produziert, um Links mit grafischen Rollover zu versehen. Dabei wurde bei Mouseover über ein Grafik per Javascript [...]