Dagi: mouse-over

Hallo Leute,

ich hab diese Frage am Freitag schonmal gestellt und ein paar ganz liebe Antworten bekommen, die ich aber nicht ganz verstanden habe, weil ich dafuer noch nicht gut genug bin:

Wie programmiere ich, dass beim mouse-over ein Bild an einer anderen Stelle aufgemacht wird? Kann mir da jemand vielleicht sogar einen Quelltext zu schicken? Ich habe Tage im Internet verbracht um das rauszukriegen und ich find es nicht. Hier ist mein Quelltext, der mouse-over klappt, aber eben nur an der selben Stelle.

Danke fuer Eure Hilfe!!!
Dagi

<html>

<head>
<title>PORTRAITS</title>

<script language="JavaScript">
<!--
Normal1 = new Image();
Normal1.src = "Pucki.gif";
Highlight1 = new Image();
Highlight1.src = "Pucki-gross.gif";

function Bildwechsel(Bildnr,Bildobjekt)
{window.document.images[Bildnr].src = Bildobjekt.src;}
-->
</script>
</head>

<body bgcolor="#000000">

<a href="#" onMouseOver="Bildwechsel(0,Highlight1)" onMouseOut="Bildwechsel(0,Normal1)">
<img src="Pucki.gif" border="0" style="position:absolute; left:800px; top:200px" alt="PORTRAIT">
</a>

</body>
</html>

  1. Hallo Dagi,

    ich hab diese Frage am Freitag schonmal gestellt und ein paar ganz liebe Antworten bekommen, die ich aber nicht ganz verstanden habe, weil ich dafuer noch nicht gut genug bin:

    Das wird aber bestimmt noch, denn was du willst ist ja keine Hexerei!

    Wie programmiere ich, dass beim mouse-over ein Bild an einer anderen Stelle aufgemacht wird? Kann mir da jemand vielleicht sogar einen Quelltext zu schicken? Ich habe Tage im Internet verbracht um das rauszukriegen und ich find es nicht. Hier ist mein Quelltext, der mouse-over klappt, aber eben nur an der selben Stelle.

    Vergiss die vorgefertigten Dreamweaver oder Frontpage-Funktionen, die taugen überhaupt nicht für deine Zwecke: Ich würde an deiner Stelle mit einem Frameset arbeiten, denn wahrscheinlich hast du ja mehr als nur dieses Pucki-Bild und die Bilder sind auch nicht alle im gleichen Format. Wenn doch, dann geht es vielleicht auch ohne Frameset.

    Also, wenn du, sagen wir mal in dem Frame links unterschiedliche Thumbnails (kleine Versionen deiner Bilder) präsentierst, kannst du onMouseover durchaus in einem anderen Frame die Großversionen präsentieren:

    Nehmen wir einmal an, das sei dein Frameset:

    <frameset cols="200,*>
      <frame name="mouseoverMenu" src="thumbnailMenu.html">
      <frame name="bildAnzeige" src"leer.html">
    </frameset>

    Dann kannst du Folgendes in den Head-Bereich deiner Datei "thumbnailMenu.html" schreiben:

    <script type="text/&JavaScript">
    <!--
    function wechsel(bild) {
      parent.bildAnzeige.location.href=bild;
    }
    -->

    und in den Body-Bereich deiner Datei thumbnailMenu.html schreibst du z.B.

    <a href="pucki-gross.jpg" target="bildAnzeige" onMouseover="wechsel('pucki-gross.jpg')><img src="pucki-klein.jpg"></a>

    So können auch Leute, die JS deaktiviert haben, die Großversionen deiner Bilder anschauen. Dafür müssen sie dann allerdings auch auf das Bild klicken. Für die meisten, die JS eingeschaltet haben, müsste es ohne Klick gehen, schon wenn sie nur mit der Maus über das kleine Vorschaubild fahren. Das willst du ja, wenn ich dich richtig verstanden habe.

    Gruß Gernot

    1. Hallo Dagi nochmal,

      <script type="text/&JavaScript">
      <!--
      function wechsel(bild) {
        parent.bildAnzeige.location.href=bild;
      }
      -->

      </script>

      ist ja klar, dass das schließende </script>-Tag da auch noch hin muss.

      Gruß Gernot

      1. Hallo lieber, netter Gernot,

        komme grad von der Arbeit und sehe, dass Du so nett und hilfsbereit und fuer mich verstaendlich auf meine Frage geantwortet hast. Ich habs noch nicht probiert, aber ich kann schon sagen, dass ich verstehe was Du schreibst!!!! Ich finde so nett, dass Du Dir Zeit nimmst, das so ausfuehrlich zu erklaeren nur um mir zu helfen. Danke, danke, danke, ich freu mich so!

        Viele Gruesse,
        Dagi

        1. Hallo Dagi,

          ich hatte noch einen Tippfehler drin; ein &-Zeichen vor dem Wort "javascript", aber das hättest du wahrscheinlich auch selbst bemerkt:

          <script type="text/javascript">
          <!--
          function wechsel(bild) {
            parent.bildAnzeige.location.href=bild;
          }
          -->
          </script>

          Gruß Gernot