Richard Buch: Cursor-Veränderung in einer Area

Hallo zusammen!

Ja, es gibt schon etliche Beiträge zu diesem Thema. Aber eine gute Lösung für mein Problem habe ich nicht gefunden. Vielleicht kann mir ja jemand helfen?

Also: Ich habe folgenden Code

<MAP NAME="map0">
(...)
<AREA SHAPE=RECT ALT="" COORDS="243,140,311,155" onClick="(...)">(...)
  </MAP>

und möchte, dass der cursor zum pointer wird, wenn ich mit der Maus auf die area komme.

Was ich schon probiert habe:
1. in den Tag 'href="#"' eingefügt. Dann wird der cursor zwar wie bei einem normalen Link zum pointer, aber beim Anklicken gelange ich auf die einzelne Frame-Seite, in der der Link eingebettet ist.
Wenn ich bei 'href' die Seite angebe, auf der das Frameset definiert ist, ist das nicht gut, wenn man über die Menüleiste eine andere Seite im anderen Frame aufgerufen hat.
2. Ich habe ' onmouseover="javascript:style.cursor='pointer'" ' in den Area-Tag eingefügt. Keine Fehlermeldung, keine Wirkung.
3. Ich habe versucht mit <div>-Befehl einen style (mit cursor:pointer) um die area herum zu definieren - Erfolgschancen hatte ich mir eigentlich gar nicht erst ausgerechnet.

Wer kann helfen?

Vielen Dank im Voraus - auch für gute Links -,
Richard Buch

  1. Hallo Richard,

    1. Ich habe versucht mit <div>-Befehl einen style (mit cursor:pointer) um
      die area herum zu definieren - Erfolgschancen hatte ich mir eigentlich gar
      nicht erst ausgerechnet.

    Ich hätte instinktiv folgendes in mein Stylesheet geschrieben...

    area {cursor:pointer;}

    ... ohne mit irgendwelchen Div-Elementen rumzumurksen. Allerdings habe ich
    das nicht getestet.

    Tim

    1. Hi Tim,

      Ich hätte instinktiv folgendes in mein Stylesheet geschrieben...

      area {cursor:pointer;}

      ... ohne mit irgendwelchen Div-Elementen rumzumurksen. Allerdings habe ich
      das nicht getestet.

      isch 'abe. Es funktioniert in Mozilla und Opera beispielsweise nicht, weder mit <area>, noch mit <map>. Offenbar muss tatsächlich ein echter Verweis notiert werden.

      Grüße,
       Roland

      1. Hallo,

        isch 'abe. Es funktioniert in Mozilla und Opera beispielsweise nicht, weder mit <area>, noch mit <map>. Offenbar muss tatsächlich ein echter Verweis notiert werden.

        wo es funktionieren sollte steht auf:
        http://www.css4you.de/cursor.php

        hier kannst du es selbst testen:
        http://selfhtml.teamone.de/css/eigenschaften/anzeige/cursor.htm

        scrolle auf http://www.quirksmode.org/ nach unten, bis zu "table of contents". Dort wählst du "CSS" aus. Scrolle nach unten. Unter "Declaration" findest du die css-eigenschaft "cursor".
        Klicke auf "cursor" -> nun klicke auf "pointer" und ich wünsche viel spaß beim lesen.

        mfg NAG

        --
        signatur
        1. scrolle auf http://www.quirksmode.org/ nach unten, bis zu "table of contents". Dort wählst du "CSS" aus. Scrolle nach unten. Unter "Declaration" findest du die css-eigenschaft "cursor".
          Klicke auf "cursor" -> nun klicke auf "pointer" und ich wünsche viel spaß beim lesen.

          Warum nicht einfach ein direkter Link?
          http://www.quirksmode.org/css/cursor.html#pointer

        2. Hi nag,

          wo es funktionieren sollte steht auf:
          http://www.css4you.de/cursor.php

          was hilft Richard ein "sollte", wenn's speziell bei dem von ihm angeführten Beispiel eben nicht so ist?

          hier kannst du es selbst testen:
          http://selfhtml.teamone.de/css/eigenschaften/anzeige/cursor.htm

          Die Seite ist mir bekannt, hat aber nichts mit dem genannten Problem zu tun.

          http://www.quirksmode.org/css/cursor.html#pointer und ich wünsche viel spaß beim lesen.

          Dort finde ich kein Beispiel mit den Elementen <map> oder <area>, worauf wolltest du hinaus? Selbst, wenn man die Imagemap mit einem <div> umschließt und

          #testdiv:hover { cursor:pointer }

          definiert, funktioniert es in Firebird nicht. Verlässt man den verlinkten Bereich, wird der Cursor zurückgesetzt. Opera dagegen (Version 7, 6 noch nicht) lässt dies durchaus zu.

          Dieses "Verbot" erachte ich durchaus als sinnvoll und das ist womöglich der Grund dafür, dass es nicht funktioniert. Nur: Wo in den Specs ist diese Vorgangsweise definiert bzw. ist sie das überhaupt? Wenn nicht, warum kann ich es mit einer expliziten Definition im Stylesheet nicht übersteuern? Handelt es sich um einen Gecko-Bug?

          Ich habe in deinem Beitrag übrigens Verweise auf

          http://www.w3.org/TR/CSS2/ui.html#propdef-cursor,
           http://www.w3.org/TR/CSS21/ui.html#propdef-cursor und
           http://www.w3.org/TR/css3-ui/#cursor

          vermisst. ;-)

          Grüße,
           Roland