Meldung

10.12.2007 - Veränderung des Mauscursors mit JavaScript

Das Aussehen des Cursors, welcher als Mauszeiger angezeigt wird, kann situationsbedingt angepasst werden. Normalerweise wird der Mauscursor – je nachdem über welchem Element er sich befindet oder in welchem Status sich die Browseranwendung befindet – automatisch gewechselt. Lädt der Browser beispielsweise gerade Daten vom Webserver herunter, so wird der Wait-Cursor (die Sanduhr) angezeigt. Befindet sich der Mauscursor dagegen über einem Textelement – egal, ob in diesem Text angezeigt wird, oder ob es sich um ein Eingabeelement zur Eingabe von Text in einem Formular handelt –, so wird der Textcursor angezeigt.

Neben diesen Zeigern existieren weitere vordefinierte Cursor – beispielsweise ein Help-Cursor oder ein Resize-Cursor. Die in HTML bzw. mit Hilfe von CSS definierbaren Mauszeiger lassen sch jederzeit individuell einstellen. Auch das Setzen eines selbstdefinierten Bildes als Mauscursor ist unter Verwendung des entsprechenden JavaScript Code möglich.

Zu welchem Zeitpunkt oder zu welchem Anlass der Mauszeiger auf den gewünschten Wert gesetzt wird, kann der Webentwickler selbst bestimmen. So kann der Cursor beispielsweise als Antwort auf ein bestimmtes Event neu gesetzt werden. Beachten Sie bitte auch unsere Beispiele zu den Events onClick, onChange und onLoad. Aber auch die dokumentenweite Definition des Mauscursors ist möglich.

Alexander Müller