blueeye: Mouseover Effekt mit Text

Hallöchen..

Ich habe folgendes Problem.  Ich möchte gerne mit Mouseover Effekt über einem Imagemap arbeiten. Das spezielle dabei ist folgendes.

Wenn ich mit der Maus über ein Symbol im Bild fahre,  soll der dazugehörende Text (mit Links) immer an der linken oberen Ecke des Bildes erscheinen. Wenn ich dann mit der Maus über ein anderes Symbol fahre, soll der Text wieder an der gleichen Stelle wie vorher erscheinen (Bild links oben).

Für Unterstützung bin ich echt dankbar. Merci!

  1. Hi,

    Ich habe folgendes Problem.  Ich möchte gerne mit Mouseover Effekt über einem Imagemap arbeiten.

    was hast Du bisher versucht, und woran ist es gescheitert?

    Das spezielle dabei ist folgendes.

    Den Layer kannst Du beliebig positionieren, egal von wo er aufgerufen wurde.

    Cheatah

    1. Hi,

      Ich habe folgendes Problem.  Ich möchte gerne mit Mouseover Effekt über einem Imagemap arbeiten.

      was hast Du bisher versucht, und woran ist es gescheitert?

      Das spezielle dabei ist folgendes.

      Den Layer kannst Du beliebig positionieren, egal von wo er aufgerufen wurde.

      Cheatah

      Besten Dank für deine Antwort Cheatah

      Leider hilft mir deine Antwort so nicht viel. Ich geb dir mal ein Beispiel wie der Code meiner Seite jetzt ist.
      Bis jetzt erscheinen die Layer erst per Mausklick auf das Symbol. Die Layer positionieren ist für mich kein Problem.
      Ich weiss nur nicht, wie ich es anstellen muss das die Layer per Mouseon/over wechseln und nicht erst per Mouseklick angesprochen werden.

      <script language="JavaScript"> (Sript für den Ebenentausch)
      <!--
      if (document.layers)  {
           ns = 1; ie = 0;
      } else {
           ns = 0; ie = 1;
           }

      var i = 1;
      var test = "eb";
      function zeigeEbeneNr(ebene_nr){
          verbergen(eval('"' + test + i +'"'));
          zeigen(eval('"' + test + ebene_nr +'"'));
          i = ebene_nr;
          }

      function zeigen(name) {
      if (ns) {
          document.layers[''+name].visibility = "show";
          }
          else {
          document.all[''+name].style.visibility = "visible"
          }
      }

      function verbergen(name) {
      if (ns){
          document.layers[''+name].visibility = "hide"
          }
          else {
          document.all[''+name].style.visibility = "hidden"
          }
      }
      // -->
      </script>

      Aufruf der Ebenen im Imagemap:

      <img src="images/ordportal.gif" width="799" height="400" border="0" usemap="#orderportal">
                                <map name="orderportal">
                                   <area href="javascript:info()" coords="531,401,531,401,532,371,538,377,557,367,562,345,580,334,580,311,561,308,554,335,543,352,526,334,504,331,486,307,471,312,471,331,477,344,469,363,449,364,454,376,477,397" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(10)" coords="480,77,480,77,478,156,576,183,579,92" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(14)" coords="704,280,704,280,694,292,712,309,721,297,726,292" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(15)" coords="665,246,665,246,647,265,674,274,693,253" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(16)" coords="12,287,12,287,24,300,39,303,57,283,84,294,92,266,65,255,53,249,41,254,33,244,27,244,22,254" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(1)" coords="574,227,574,227,536,246,615,275,649,244" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(12)" coords="360,127,360,127,357,175,430,176,427,126" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(11)" coords="238,77,238,77,236,157,301,147,303,76" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(9)" coords="604,176,604,176,593,210,638,226,647,190,647,183" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(13)" coords="723,237,723,237,713,274,741,286,752,279,751,246" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(8)" coords="87,222,87,222,89,258,116,261,103,224" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(7)" coords="685,114,685,114,686,171,761,195,765,129" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(6)" coords="246,213,246,213,287,197,335,230,320,240,312,234,316,227,273,238" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(5)" coords="543,221,543,221,542,191,511,181,494,185,469,215,480,233,487,233,484,221,522,233" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(4)" coords="404,252,404,252,404,333,443,339,459,309,456,250,434,249" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(2)" coords="127,203,127,203,127,249,143,247,143,203" shape="polygon">
                                   <area href="javascript:zeigeEbeneNr(3)" coords="79,88,79,88,201,81,203,163,76,182" shape="polygon">
                                </map>

      Besten Dank für weitere Anworten.

      1. Hi!

        schon mal ...

        <area href="seite.html" onMouseOver="zeigeEbeneNr(10)" coords="..." shape="polygon">

        ... probiert?

        liebe Grüsse
        Bernhard

      2. Hi,

        na, darauf kann man doch jetzt mal vernünftig antworten.

        <area href="javascript:info()" coords="531,401,531,401,532,371,538,377,557,367,562,345,580,334,580,311,561,308,554,335,543,352,526,334,504,331,486,307,471,312,471,331,477,344,469,363,449,364,454,376,477,397" shape="polygon">

        Im Augenblick rufst Du Deine JavaScripts etwas holprig und fehleranfällig auf. Besser wäre es, den href ins Nichts zu schicken und das JS über den Event-Handler onClick aufzurufen, also etwa so:

        <area href="#" onClick="info()" usw. usf.>

        Damit kannst Du Dir dann den Event raussuchen, auf den die Sache anspringen soll: onClick - wie hier - beim Draufklicken, onMouseover oder onMouseout (und noch 'n paar andere).
        Du musst Dein Layerwechselskript halt nur per onMouseover aufrufen und per onMouseout wieder zurücksetzen.

        Grüße,

        Utz

        1. Hi,

          na, darauf kann man doch jetzt mal vernünftig antworten.

          <area href="javascript:info()" coords="531,401,531,401,532,371,538,377,557,367,562,345,580,334,580,311,561,308,554,335,543,352,526,334,504,331,486,307,471,312,471,331,477,344,469,363,449,364,454,376,477,397" shape="polygon">

          Im Augenblick rufst Du Deine JavaScripts etwas holprig und fehleranfällig auf. Besser wäre es, den href ins Nichts zu schicken und das JS über den Event-Handler onClick aufzurufen, also etwa so:

          <area href="#" onClick="info()" usw. usf.>

          Damit kannst Du Dir dann den Event raussuchen, auf den die Sache anspringen soll: onClick - wie hier - beim Draufklicken, onMouseover oder onMouseout (und noch 'n paar andere).
          Du musst Dein Layerwechselskript halt nur per onMouseover aufrufen und per onMouseout wieder zurücksetzen.

          Grüße,

          Utz

          Besten Dank an UTZ!!!!

          Ich hab dein Lösungsvorschlag gleich ausprobiert und es funktioniert tatellos!!!
          Manchmal sieht man nicht einmal die einfachste Lösung!
          Nochmals viilen Dank!

          Grüessli
          blueeye