Rollover-Aufruf von Bild aus Array

Arbeiten auf einer Webseite, wo ich mehrere Rollover von der gleichen Basisbild (mehrere schwarze Pixel auf der ganzen Seite verteilt - wie ein Popup-Effekt) möchte. Ich denke, der einfachste Weg ist ein Array mit allen Rollover-Bildern und ein Array mit dem Basisbild (pixel.png). Hatte viel Mühe, sogar die Bilder angezeigt zu bekommen, und jetzt, da ich das Hintergrundbild anzeigen lasse, kann ich den Rollover nicht zum Funktionieren bringen. Ich habe versucht, Probleme in Chrome mit Entwickler/Debug, aber keine Würfel - zeigt nicht einmal eine Fehlermeldung. Ich vermute, es ist etwas Einfaches wie die Funktionen nicht richtig aufrufen, aber ich kann es nur nicht sehen ..Rollover-Aufruf von Bild aus Array

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript"> 
      var revert = new Array('pixel.png'); 
      var inames = new Array('black1off.jpg', 'black2off.jpeg'); 

     //preload 
      if (document.images) { 
       var flipped = new Array(); 
        for(i=0; i< inames.length; i++) { 
         flipped[i] = new Image(); 
         flipped[i] = "media/"+inames[i]; 
         } 
        } 

      function over(num) { 
       if(document.images) { 
       revert[num] = document.images[inames[num]]; 
       document.images[inames[num]] = flipped[num]; 
       } 
      } 
      function out(num) { 
       if(document.images) { 
       document.images[inames[num]] = revert[num]; 
      }    
      } 

</script> 
</head> 
<body> 
<body bgcolor="#000000"> 

    <img src="media/pixel.png" name="pixel" height="50px" width="50px" style="position:absolute; top:30px; left:50px;" onMouseOver="over(0)" onMouseOut="out(0)"> 
    <img src="media/pixel.png" name="pixel" height="50px" width="50px" style="position:absolute; top:30px; left:200px;" onMouseOver="over(1)" onMouseOut="out(1)"> 
    </body> 
    </html>

Quelle

2016-04-24 theYnot

Es ist einfach, aber was du nicht einmal in der Nähe gebucht war:

Hier ist die Arbeitsbeispiel: https://jsfiddle.net/tqw84trm/1/

if (document.images) { 
    var flipped = new Array(); 
    for(i=0; i< inames.length; i++) { 
    flipped[i] = new Image(); 
    flipped[i].src = "media/"+inames[i]; 
    } 
} 

function out (num) { 
    if(document.images) { 
    var rev = revert.slice(); 
    revert[num] = document.images[num].src; 
    document.images[num].src = rev[num]; 
    }    
}

Quelle

2016-04-24 01:15:06

dam Mann, den ich Ihre Antwort wissen, ist richtig, aber ich kann es einfach nicht die Art und Weise funktioniert ich will es. Vielleicht muss ich anfangen, an einem Plan B zu arbeiten – theYnot

Antwort

Verwandte Themen