Fondu enchainé javascript pur

Version imprimable

23/07/2011, 11h09
Invité

Fondu enchainé javascript pur

Bonjour,
Surement vieux jeux, je codes toujours mes javascript, (peut-être a tort :oops:)
Bref je voudrais faire un fondu echainé d'images, un code sommaire mais compatible IE FireFox Opera etc ...
pour cela j'utiliserais

Code:

Cadre.filters.blendTrans.Play(2)

par exemple avec un DIV ayant comme style

Code:

FILTER: blendTrans(Duration=2);

Apparament cela ne marche pas sous firefox :cry:

Que me conseillez vous
merci d'avance
23/07/2011, 11h18
NoSmoking

Bonjour,

Citation:

Apparament cela ne marche pas sous firefox :cry:

FILTERS est exclusif IE si je ne m'abuse.

mais il existe http://javascript.developpez.com/demos/fondu/

[edit] Rubrique Contribuez, c'est ici http://www.developpez.net/forums/d88...ondu-enchaine/
23/07/2011, 11h28
Invité

Merci a toi,
Mais sur ton premier lien il me dit

Citation:

Détails de l’erreur de la page Web

Agent utilisateur : Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727; .NET CLR 1.1.4322; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; .NET4.0C; .NET4.0E)
Horodateur : Sat, 23 Jul 2011 09:27:06 UTC
Message : Cet objet ne gère pas cette propriété ou cette méthode
Ligne : 42
Caractère : 7
Code : 0
URI : http://javascript.developpez.com/demos/fondu/

:(

Citation:

Message : Cet objet ne gère pas cette propriété ou cette méthode

ah oui!
...effectivement cela plante sour IE<9 because document.getElementsByClassName et donc par rebond Array.indexOf qui plante car non implémenté.

Il te faut donc modifer Fondu.prototype.getImages.
il y aurait plusieurs méthodes, je t'en livre une

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
31
32
33
34
35
36
37
38
39
Fondu.prototype.getImages = function(){
  var tmp = [];
  if(document.getElementsByClassName){
    tmp = document.getElementsByClassName(this.classe_img);
  }
  else{
    var tImg, i=0;
/* PARTIE A SUPPRIMER --
    while(document.getElementsByTagName('*')[i]){
      if(document.getElementsByTagName('*')[i].indexOf(this.classe_img)>-1){
        tmp.push(document.getElementsByTagName('*')[i]);
      }
      i++;
    }
  }
*/
    // correctif Array.indexOf non supporte sur <IE9
    tImg = document.getElementsByTagName('*');
    while( tImg[i]){
      if( tImg[i].className && tImg[i].className.indexOf(this.classe_img)>-1){
        tmp.push( tImg[i]);
      }
      i++;
    }
  }
  var j=tmp.length;
  while(j--){
    if(tmp[j].filters){
      tmp[j].style.width = tmp[j].style.width || tmp[j].offsetWidth+'px';
      tmp[j].style.filter = 'alpha(opacity=100)';
      tmp[j].opaque = tmp[j].filters[0];
      this.coeff = 1;
    }
    else{
      tmp[j].opaque = tmp[j].style;
    }
  }
  return tmp;
}

voila, il faudrait faire remonter l'information dans le 2nd lien que j'ai mis.

23/07/2011, 17h50
Invité

Ok et merci ! :ccool:
23/07/2011, 18h02
Bovino

En fait, ce n'est pas un bug mais un oubli dans le code.
Effectivement, pour IE<9 on passe dans le else mais il manque quelque chose dans la condition :

Code:

if(document.getElementsByTagName('*')[i].className.indexOf(this.classe_img)>-1)

en fait, on recherche si l'élément possède la classe souhaitée, j'avais juste oublié le className ;)

EDIT : d'ailleurs, le code fourni dans la discussion est correct à ce niveau, c'est juste celui de la page d'exemple qui était erroné (c'est maintenant rectifié)
23/07/2011, 19h42
Invité

Bonjour l'Ami ,
Tu es toujours disponible, et efficace, super pour moi cette mise au point !
merci a tous ;)
25/07/2011, 22h10
NoSmoking

OUPS !!!:oops:

Citation:

Envoyé par moi même

...et donc par rebond Array.indexOf qui plante car non implémenté.

j'ai répondu un peu vite, d'autant qu'il s'agit d'une nodeList et pas d'un tableau...