Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Entwicklung & Design

CSS-Experiment: Alle Apple-Mäuse als CSS-Grafik

CSS-Demo veranschaulicht die Geschichte der Apple-Mäuse. (Screenshot: Codepen)

Die Apple-Mäuse von der Maus des Lisa-Computers bis zur aktuellen Magic-Mouse zeigt euch eine großartige CSS-Demo auf Codepen. Sie zeigt nicht nur, was man mit CSS so alles anstellen kann, sondern erlaubt auch einen Blick zurück auf die Geschichte der Apple-Mäuse.

CSS-Demo veranschaulicht die Geschichte der Apple-Mäuse. (Screenshot: Codepen)
CSS-Demo veranschaulicht die Geschichte der Apple-Mäuse. (Screenshot: Codepen)

CSS: Alle Apple-Mäuse im Überblick

Der in Toronto lebende Josh Bader hat eine schöne CSS-Demo gebastelt, mit der ihr einen Blick auf acht ikonische Mäuse aus dem Hause Apple werfen könnt. Beim Öffnen der Demo seht ihr als erstes die aktuelle Magic-Mouse, mit der sicher der eine oder andere von euch auch arbeitet. Ein Klick und die Maus verwandelt sich vor euren Augen in das Vorgängermodell – die Mighty-Mouse in der schnurlosen Variante die 2006 auf den Markt kam.

Davor kam die Pro-Mouse aus dem Jahre 2000. Unter der Bezeichnung iMac-Mouse zeigt euch Bader dann die runde Apple-USB-Mouse die 1998 auf den Markt kam und bei nicht wenigen Nutzern noch heute als Ärgernis gilt. Davor verkaufte Apple die zwar weniger ansprechend aussehende, aber letztlich funktionalere Apple-Desktop-Bus-Mouse-2 sowie ihren Vorgänger, die Apple-Desktop-Bus-Mouse. Letztere entsprach von ihrem eckigen Design her auch eher den beiden Mäusen, die Apple mit dem Lisa-Computer und dem Macintosh verkaufte.

CSS-Demo: Die USB-Maus war bei vielen Nutzern recht unbeliebt. (Screenshot: Codepen)
CSS-Demo: Die USB-Maus war bei vielen Nutzern recht unbeliebt. (Screenshot: Codepen)

CSS-Demo: Apple-Mäuse liegen auf Codepen

Baders CSS-Demo macht die Entwicklung der Apple-Mäuse von 1983 bis 2009 sehr schön nachvollziehbar. Die zugrundeliegende CSS-Datei könnt ihr euch direkt auf Codepen anschauen. Bei einem kleinen Test wechselte leider der Name unter der ausgewählten Maus nicht, wenn wir zwischenzeitlich einen anderen Tab geöffnet hatten. Davon abgesehen ist die Demo wirklich gut gemacht. Wer lieber die Tastatur beim Wechseln zwischen den Mäusen verwenden will, der kann die Version der CSS-Demo des Codepen-Nutzers Yukulélé nutzen.

Arbeitet ihr mit den Mäusen aus Cupertino? Wenn ja, welche Apple-Maus war eure Erste? Und welche ist euer Favorit?

1 von 8

Bitte beachte unsere Community-Richtlinien

Schreib den ersten Kommentar!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Finde einen Job, den du liebst