Peggy: zweifacher Bildertausch mit hover

SELF-Forum

zweifacher Bildertausch mit hover

Peggy
– Informationen zu den Bewertungsregeln

Hallo,
ich versuche mich gerade ein bißchen mit Javascripten zu beschäftigen. Dabei möchte ich eigentlich nur eine recht simple Sache erreichen: eine Leiste mit Buttons (Knöpfen) soll, wenn sie gedrückt werden, einen Bildtausch im selben Fenster erzeugen. Bis dahin bin ich auch schon gekommen (siehe Quellcode unten). Allerdings möchte ich neben dem Rollover-Effekt auch erreichen, dass bei onClick nicht nur das (große) Bild ausgetauscht wird, sondern auch das Button-Bild selbst getauscht wird und somit zeigt, an welcher Stelle in der Bilderleiste man sich befindet. Wenn der nächste Button dann gedrückt wird, soll der vorher gedrückte wieder den ursprünglichen Zustand annehmen und ein neues (großes) Bild geladen werden, aber auch das gerade gedrückte Button getauscht werden. Wer kann mir helfen, mein Script zu vervollständigen? Danke.

<html>
<head>
<title>Bilder</title>
<script type="text/javascript">
<!--
knopf_Normal = new Image();
knopf_Normal.src="knopf.gif";
knopf_Aktiv = new Image();
knopf_Aktiv.src="knopfvoll.gif";

function bild(b) {
  document.b1.src=b
}
//-->
</script>
</head>
<body bgcolor="#CCCCCC">
<table>
<tr>
<td> <td>
<a href="javascript:bild('bild1.jpg')"
onMouseOver="knopf1.src=knopf_Aktiv.src"
onMouseOut="knopf1.src=knopf_Normal.src"
onClick="knopf1.src=knopf_Aktiv.src">
<img src="knopf.gif" name="knopf1" width="20" height="18" border=0>
</a></td>
<td>
<a href="javascript:bild('bild2.jpg')"
onMouseOver="knopf2.src=knopf_Aktiv.src"
onMouseOut="knopf2.src=knopf_Normal.src"
onClick="knopf2.src=knopf_Aktiv.src">

<img src="knopf.gif" name="knopf2" width="20" height="18" border=0>
</a></td>
<td><img src="bild1.jpg" name="b1"></td>
</tr>
</table>
</body>
</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. zweifacher Bildertausch mit hover

    L00NIX
    – Informationen zu den Bewertungsregeln

    Hallo.

    Statt zu vervollständigen, gebe ich lieber mal ein paar Tipps:

    1.) Merke dir, welcher Knopf gerade aktiv ist (Flag)

    2.) Initialisiere das Flag aus 1) beim ersten Laden der Seite

    3.) Benutze das Flag aus 1), um bei Topicwechsel das gerade aktive zurück zu setzen und aktiviere anschließend das neue Topic und setze das Flag auf dieses

    4.) Frage in den Funktionen bei onMouseOver und OnMouseOut das Flag ab, ob überhaupt was getauscht werden muss (das aktive sollte ja aktiv bleiben)

    5.) Blöd ist nur beim Seitenwechsel das übergeben des Flags: Entweder mit Keks oder in der URL. Sonst fällt mir leider keine Möglichkeit ein. :-(

    Gruß
      L00NIX

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. zweifacher Bildertausch mit hover

      Cybaer Homepage des Autors
      – Informationen zu den Bewertungsregeln

      Hi,

      5.) Blöd ist nur beim Seitenwechsel das übergeben des Flags: Entweder mit Keks oder in der URL. Sonst fällt mir leider keine Möglichkeit ein. :-(

      Via Frameset oder besser: window.name

      Gruß, Cybaer

      --
      Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
      Beitrag melden
      –
      Informationen zu den Bewertungsregeln