2011-12-27 1 views
4

ok, le code suivant fonctionne bien dans IE7 + et Chrome. mais pour une raison quelconque, xfade est non défini dans FirefoxLa fonction n'est pas définie dans Firefox seulement

<html> 
    <body> 
     <div id="slider"></div> 
     <script type="text/javascript"> 
var Klimateka = { 
    Slider: function() { 
     // Check if we have a slider div on page 
     var slider = document.getElementById('slider'); 
     if (slider != null) { 
      var images = ["slide-image-1.jpg", "slide-image-2.jpg", "slide-image-3.jpg", "slide-image-4.jpg"]; 
      var i = images.length; 
      while (i) { 
       i -= 1; 
       var img = document.createElement("img"); 
       img.src = "images/" + images[i]; 
       slider.appendChild(img); 
      } 
      var d = document, imgs = new Array(), zInterval = null, current = 0, pause = false; 
      imgs = d.getElementById("slider").getElementsByTagName("img"); 
      for (i = 1; i < imgs.length; i++) imgs[i].xOpacity = 0; 
      imgs[0].style.display = "block"; 
      imgs[0].xOpacity = .99; 

      setTimeout("xfade()", 3500); 

      function xfade() { 
       cOpacity = imgs[current].xOpacity; 
       nIndex = imgs[current + 1] ? current + 1 : 0; 

       nOpacity = imgs[nIndex].xOpacity; 

       cOpacity -= .05; 
       nOpacity += .05; 

       imgs[nIndex].style.display = "block"; 
       imgs[current].xOpacity = cOpacity; 
       imgs[nIndex].xOpacity = nOpacity; 

       setOpacity(imgs[current]); 
       setOpacity(imgs[nIndex]); 

       if (cOpacity <= 0) { 
        imgs[current].style.display = "none"; 
        current = nIndex; 
        setTimeout(xfade, 3500); 
       } else { 
        setTimeout(xfade, 50); 
       } 

       function setOpacity(obj) { 
        if (obj.xOpacity > .99) { 
         obj.xOpacity = .99; 
         return; 
        } 
        obj.style.opacity = obj.xOpacity; 
        obj.style.MozOpacity = obj.xOpacity; 
        obj.style.filter = "alpha(opacity=" + (obj.xOpacity * 100) + ")"; 
       } 
      } 
     } 
    }, 

    bar: function() { 
    } 
}; 

Klimateka.Slider(); 

i ont la configuration d'un jsfiddler pour les tests: http://jsfiddle.net/rTtKh/10/

Répondre

5

This might only apply to Firefox:

fonctions ne hissent pas quand déclaré dans un bloc enfant.

Vous déclarez xfade l'intérieur du bloc if, mais vous l'appeler avant la déclaration:

setTimeout(xfade, 3500); 

Mettez la déclaration de fonction au-dessus. Vous devez faire la même chose avec setOpacity à l'intérieur xfade.<- Ce n'est pas nécessaire.

+0

Ahhhh haaaaa. l'ai eu^_ ^. cela est logique: -D – Neal

+0

Oui - aussi ce serait une très bonne idée de s'assurer que toutes les variables de "xfade()" sont correctement déclarées avec 'var' au niveau de la portée approprié. – Pointy

+0

@Pointy - Je pense que vous l'avez manqué, car ils sont déclarés. – Dementic

1

Fixez votre ligne qui dit ceci: setTimeout("xfade()", 3500); pour répondre à vos autres :

setTimeout(xfade, 3500); 
+0

Le violon utilise déjà cette version, mais l'erreur est toujours là. –

+0

Je me demande ce qui le rend fonctionnel dans IE et Chrome. Je sais que IE fait des choses bizarres avec des expressions de fonction * nommées *, mais cette fonction "xfade" est juste une déclaration de fonction régulière. * edit * - ah. :-) – Pointy

+0

@Pointy voir ['@ Felix's' réponse] (http://stackoverflow.com/a/8645473/561731)^_^ – Neal

0

Utilisez plutôt setTimeout (xfade, 3500).

Questions connexes