snafu: Bilderwechsel mit Link und Maps

Moin,

ich habe ein Problem mit dem Bilderwechsel:
Ich habe eine Tabelle in der Art:

|----------T----------|
|   1      |    2     |
|----------+----------|
|          |          |
|   3      |    4     |
|          |          |
|----------i----------|

Wenn jetzt die Mouse über Feld (bzw. Bild) 1 geht soll sich in Feld 3 eine Bild, dass als Menü dient, erscheinen.
Das Menü soll mit Maps in Links unterteilt werden.
Das gleiche gilt für 2 und 4.
Frage:
Wie bekomme ich es jetzt möglichst einfach hin, dass man mit der Maus von Feld eins in Feld drei kann, ohne dass das Bild wieder verschwindet und dass das neue Bild mit Maps in Links eingeteilt werden kann?

Danke für jeden Tipp :-)
Stephan

  1. |----------T----------|
    |   1      |    2     |
    |----------+----------|
    |          |          |
    |   3      |    4     |
    |          |          |
    |----------i----------|

    Hi!

    hm, eine Idee -- keine Ahnung, ob sie so funktioniert -- wäre die folgende:

    Event_handler für:

    * Bild 1&2:

    onMouseOver="zeigeBilder34()"
       onMouseOut lässt du weg

    * Bild 3&4:

    onMouseOut="versteckeBilder34()"

    wobei du die area & map-Tags nur dann aktivierst, wenn Bild 3 bzw. 4 aktiviert ist, also quais in die Funktion zeigeBilder34 einbindest ...

    So würde zumindest ich einmal einen Ansatz versuchen, aber, wie gesagt, Angaben wie immer ohne Gewähr! ;-)

    Greetingz,

    Manfred

    --
    "Man muss die Welt nicht verstehen, man muss sich nur in ihr zurechtfinden" (Albert Einstein)
    Manfred Wiesinger
    http://manfred-wiesinger.com
    http://menphrad.net
    1. Hi, menphrad !!
      Ein fertiges Skript kommt immer besser, wah !?
      ;o))

      <html><head><title></title>
      <script language="javascript">
      function zeige (hallo)
      {document.getElementById(hallo).style.visibility='visible';}
      </script>
      <body>
      <table border="1">
      <tr>
      <td width="200" height="100" onMouseOver="zeige ('Bild_1')"> </td>
      <td width="200" height="100" onMouseOver="zeige ('Bild_2')"> </td>
      </tr>
      <tr>
      <td width="200" height="300">
      <map name="imagemap_1"><area shape="rect" coords="10,10,30,30" href="url_1.htm"></map>
      <img src="1.jpg" id="Bild_1" style="visibility:hidden" usemap="#imagemap_1" border="0"></td>
      <td width="200" height="300">
      <map name="imagemap_2"><area shape="rect" coords="10,10,30,30" href="url_2.htm"></map>
      <img src="2.jpg" id="Bild_2" style="visibility:hidden" usemap="#imagemap_2" border="0"></td>
      </tr>
      </table>
      </body></html>

      Hi, snafu !!
      Hier die DOM-Version . . .
      Dies ist natuerlich nur das Grundgeruest und muss halt noch  entsprechend ausgebaut werden !
      Du machst das schon !!
      :o))

      1. Hi, menphrad !!
        Ein fertiges Skript kommt immer besser, wah !?
        ;o))

        Mich so tief in hypothetischen Gedanken zu wälzen ... dafür war ich zuerst schon zu müde! ... Aber wie man sieht, hast Du mir die Arbeit ja eh abgenommen? *g* ;-)

        Greetingz,

        Manfred

        --
        "Man muss die Welt nicht verstehen, man muss sich nur in ihr zurechtfinden" (Albert Einstein)
        Manfred Wiesinger
        http://manfred-wiesinger.com
        http://menphrad.net
      2. Hi, menphrad !!
        Ein fertiges Skript kommt immer besser, wah !?
        ;o))

        Und ein vollständiges Script kommt immer *noch* besser, wah! ;-)

        NEU: Jetzt auch mit der "Verstecke-Funktion"! *g*

        <html><head><title></title>
        <script language="javascript">
        function zeige (hallo){
         document.getElementById(hallo).style.visibility='visible';
        }
        function verstecke (hallo){
         document.getElementById(hallo).style.visibility='hidden';
        }
        </script>
        <body>
        <table border="1">
        <tr>
        <td width="200" height="100" onMouseOver="zeige ('Bild_1')"> </td>
        <td width="200" height="100" onMouseOver="zeige ('Bild_2')"> </td>
        </tr>
        <tr>
        <td width="200" height="300" onMouseOut="verstecke ('Bild_1')">
        <map name="imagemap_1"><area shape="rect" coords="10,10,30,30" href="url_1.htm"></map>
        <img src="1.jpg" id="Bild_1" style="visibility:hidden" usemap="#imagemap_1" border="0"></td>
        <td width="200" height="300" onMouseOut="verstecke ('Bild_2')">
        <map name="imagemap_2"><area shape="rect" coords="10,10,30,30" href="url_2.htm"></map>
        <img src="2.jpg" id="Bild_2" style="visibility:hidden" usemap="#imagemap_2" border="0"></td>
        </tr>
        </table>
        </body></html>

        Greetingz,

        Manfred

        --
        "Man muss die Welt nicht verstehen, man muss sich nur in ihr zurechtfinden" (Albert Einstein)
        Manfred Wiesinger
        http://manfred-wiesinger.com
        http://menphrad.net
        1. Und ein vollständiges Script kommt immer *noch* besser, wah! ;-)

          Heurido !!
          Da hatter Recht !!
          :o))

        2. Hi menphrad und 08/15,

          Vieeeeeeeeeeeeeeelen Dank euch beiden :-)
          Das ist perfekt. Super!

          Danke
          Stephan :-)

          1. Geeeeeeeeeeeeeerneeeeeeeeee! Freut mich, dass ich helfen konnte! ;-)
            *Viel Erfolg noch!*

            Greetingz,

            Manfred

            --
            "Man muss die Welt nicht verstehen, man muss sich nur in ihr zurechtfinden" (Albert Einstein)
            Manfred Wiesinger
            http://manfred-wiesinger.com
            http://menphrad.net