BlackBoard | Druckvorschau: Button change, wenn Maus drüber fährt

Geschrieben von SS-L am 08.07.2002 um 15:44:

Button change, wenn Maus drüber fährt

Hi,

mach zurzeit ne Page für'n Freund, und hab da 'n kleines Prob! Er hat nen Diablo2-Clan und da dachte ich, dass die Original Buttons aus Diablo gut kommen würden. Also hat er mir 'n paar Screenshots geuppt. Ich hab die dann soweit bearbeitet, dass ich für jeden Link 2 Buttons hatte, einmal Normal und einem wenn er gedrückt ist. Nur die Scripte mit denen ich das eingebunden habe funzen nicht! Weder im IEx, noch im Opera...

Hier Script #1:

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:

<head>
  <script type="text/javascript" language="JavaScript">
  <!-
    function Bildwechsel(Bildnr,Bildobjekt)
      {
        window.document.images[Bildnr].src = Bildobjekt;
     }
  //->
  </script>
</head>

<body>
  <a href="index.html" target="mitte" onmouseover="Bildwechsel(0,'bild1.gif')" onmouseout="Bildwechsel(0,'bild0.gif')">
    <img src="bild0.gif" border="0" name="bild0">
  </a>
</body>

Hier Script #2:

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:

<SCRIPT LANGUAGE="Javascript">
<!-- Swap images
function Permut (flag,img) {
   if (document.images) {
        if (document.images[img].permloaded) {
            if (flag==1) document.images[img].src = document.images[img].perm.src
            else document.images[img].src = document.images[img].perm.oldsrc
        }
   }
}
function preloadPermut (img,adresse) {
   if (document.images) {
        img.onload = null;
        img.perm = new Image ();
        img.perm.oldsrc = img.src;
        img.perm.src = adresse;
        img.permloaded = true;
   }
}
// -->
</SCRIPT>

Ersetzen Sie dann den üblichen IMG-Tag durch den folgenden Tag für den Aufruf von Bildern:

<A HREF="index.html" onMouseover="Permut(1,'IMG1');" onMouseout="Permut(0,'IMG1');">
<IMG SRC="Image1" border=0 NAME="IMG1" onLoad="preloadPermut(this,'Image2');" ></A>

Dabei steht index.html für das Dokument, auf das das Bild zeigt, Image1 steht für das Bild, das beim Laden der Seite angezeigt wird, und Image2 steht für das Bild, durch das Image1 ersetzt wird, wenn der Mauszeiger darüber gezogen wird.

PLEASE HELP ME....

Geschrieben von z|x am 09.07.2002 um 00:27:

nimm einfach das Script:
http://selfhtml.teamone.de/javascript/beispiele/buttons.htm
damit kannst Du nix falsch machen..
greetz faKe$lAsH

Geschrieben von LX am 09.07.2002 um 05:40:

Oder die Erklärungen auf meiner Homepage dazu: Demo, Quellcode mit Erklärungen. In den Erklärungen schreibe ich zwar, dass man die Event Handler in den IMG-Tag setzt, allerdings ist es für Buttons zu empfehlen, sie in den A-Tag zu setzen (Netscape 4 bekommt sonst Probleme damit).

Geschrieben von SS-L am 09.07.2002 um 12:25:

THX @ll:

werd's sofort ausprobieren