2010-06-28 9 views
0

Donc dans mon script j'ai ...JavaScript Timed image Swap Besoin d'aide

<script type="text/javascript"> 
var images = new Array(); 
var numImages = 3; 
var index = 0; 

function setupSwapper() { 
    for (i = 0; i < numImages; i++) { 
     images[i] = new Image(266, 217); 
     images[i].src = "images/image" + i + ".png"; 
    } 
    setTimeout("swapImage()", 5000); 
} 

function swapImage() { 
    if (index >= numImages) { 
     index = 0; 
    } 
    document.getElementById('myImage').src = images[index].src 
    index++; 
    setTimeout("swapImage()", 5000); 
} 
</script> 

Et puis je <body onload="setupSwapper()"> pour installer le corps.

et <img width=266 height=217 id="myImage" name="myImage" src="images/image0.png"></img> ailleurs dans mon document.

Seule l'image initiale (image0.png) apparaît. Je suis probablement aveugle d'avoir regardé ça si longtemps. Les images ne s'échangent pas.

+0

OK merci pour l'édition !! – Pointy

+1

La balise '' n'est pas supposée avoir une balise de fermeture '' dans HTML 4 ("End tag: forbidden" http://www.w3.org/TR/REC-html40/struct/objects.html#h -13.2) ou devrait simplement être auto-clos '' en XHTML –

Répondre

1

Utilisez FireBug ou un outil similaire pour le débogage ce qui se passe:

  • Est-ce que le img élément DOM en fait obtient son src a changé?
  • Voyez-vous des activités réseau qui tentent de charger les images? ça réussit?
  • Mettre en place des points d'arrêt dans votre code et voir ce qui se passe dans le débogueur

BTW - Vous pouvez utiliser setInterval au lieu de setTimeout - il définit une répétition de minuterie

0

Vous êtes absent le () dans la définition de "setupSwapper".

De même c'est setTimeout, pas setTimeOut.

Enfin, débarrassez-vous de l'attribut "type" sur votre tag <script>.

Vous pouvez commencer "index" à 1 au lieu de 0.

+0

désolé à ce sujet, ce sont deux fautes de frappe, malheureusement, je voudrais que ce fut aussi facile. Je vais modifier cela. – devMeSilus

+0

J'ai mis à jour la réponse à nouveau. – Pointy

0

Le chemin à parcourir:

  1. setTimeout (swapImage, 5000);
  2. [OUBLIEZ] l'attribut type n'a rien à voir avec elle
  3. [FORGET] l'indice n'a rien à voir avec elle
  4. [OPTION] supprimer l'attribut "nom" de l'image (inutile)
  5. [ FACULTATIF] fermer les balises d'image comme < img/>

Remarque: 2-5 concerne l'exactitude. Seul le premier est important pour le faire fonctionner.

+0

Pointy: (pourquoi avez-vous supprimé votre commentaire?) Hm, peut-être que vous pourriez pointer vers un exemple, ou une partie relative dans le code source de Firefox, parce que c'est tout simplement stupide. L'attribut Type fait partie de la spécification HTML4, bien qu'il soit ignoré (l'attribut n'est pas le contenu) par la plupart des navigateurs. La raison en est qu'ils font plus confiance à l'en-tête de type de contenu qu'à l'attribut de type du script. C'est pourquoi ils l'ont sorti de la spécification HTML5. Mais il ne provoquera aucune erreur, et est valide (X) HTML! – galambalazs

+0

J'ai supprimé mon commentaire car il était faux :-) – Pointy

+0

arrive à tout le monde ... :) – galambalazs

0

Obtenez Firebug, utilisez son débogueur pour mettre des points d'arrêt à l'intérieur de swapImage pour voir s'il est frappé après le délai d'expiration. Une autre méthode consiste à utiliser l'API console.* pour voir ce qui se passe (par exemple, console.log).