Maustuning: Benutzerdefinierte Cursor Bilder (custom cursor images)

mausSo, Feierabend für heute – aber damit die Welt mal weiß, womit Webdesigner ihre Zeit vertrödeln, möchte ich verraten, dass ich heute gute 4 Stunden damit verbracht habe, herauszufinden, wie ich einen benutzerdefinierten Cursor auf eine Webseite bringe.

 

Grundsätzlich kann man – zumindest im IE und im FF – eigene Bilder als Cursor-image einbinden. Die Krux ist nur, dass nicht alle Browser alle Grafikformate unterstützen und auch nicht unter allen Betriebssystemen. So unterstützt z.B. der Internet Explorer nur .cur und .ani als Format, während Firefox .ani überhaupt nicht und unter Linux .cur nicht unterstützt. (Quelle: self-html) Aus diesem Grund ist es ratsam immer eine Alternative zum Bild anzugeben.

Via .css sieht es dann beispielsweise so aus:

a {cursor: url(images/einbild.cur), pointer;}

Wenn also das Bild aus welchen Gründen auch immer nicht geladen wird, erscheint Gottes Zeigefinger ;-).

Aber wer jetzt denkt, dass es das schon war, irrt. Im FF kann man als Bild auch ein .gif nehmen, der IE will jedoch (wie schon erwähnt) ein .cur oder .ani haben. Dazu braucht man ein spezielles Programm. Ich habe mir Axialis als Testversion runtergeladen. Die Software gefällt mir sehr gut und wird wohl demnächst als Vollversion erworben werden. Vorerst jedoch möchte ich mir auch noch Microangelo anschauen. Axialis kann sehr gut .cur Dateien erstellen – ob nun selbst gepixelt oder über Einfügen von Bildern. Es werden verschiedene Größen angeboten, die größte Größe ist 128×128 pixel. Alles ganz toll, wenn einem nur nicht der IE wieder einen Strich durch die Rechnung machen würde. Dem kann man nämlich so große .cur Dateien nicht vorsetzen, er verkleinert das automatisch auf die Standardgröße von 32×32 Pixel – jedenfalls habe ich keine Möglichkeit gefunden, die ihn dazu veranlassen könnte, die Bilddatei in Originalgröße darzustellen.

Wenn man jedoch ein Cursorbild möchte, welches sehr detalliert ist, kann man das für den IE schlichtweg vergessen. Eine kleine Tinkerbell ist nur noch als Fleck zu erkennen. Also müsste man zwei Bilder machen: ein größeres für den FF, ein kleineres für den IE und unter Umständen für den IE ein ganz anderes Motiv nehmen.

Alles in allem ist das grafisch eine ziemlich aufwändige und damit auch teure Angelegenheit, wenn man nicht unter den frei downloadbaren Cursorbildern etwas findet, was auf Anhieb passt.

_
Bildquelle: istockphoto